<template>
	<view class="main">
		<van-toast id="van-toast" />
		<van-dialog id="van-dialog" />
		<view class="hand">

			<view class="kant" v-if="poster">
				<view class="ddtap" v-for="item in posterList" :key="item.id" @click="gogd(item.url,item.jump,item.msg,item.libId,item.teamId)">
					<image :src="item.img"></image>
				</view>
			</view>
			<view class="tap" v-else>
				<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/ddc1.png"></image>
				<view class="hlogo">
					<image :src="wechat_view.logo"></image>
				</view>
			</view>

		</view>
		<view class="showhand">
			<view :class="showclass=='1'?'sone':'sone1'" @click="tapbtn(1)" v-if="oftenList.length!=0">
				单次充电
			</view>
			<view :class="showclass=='2'?'sone':'sone1'" @click="tapbtn(2)" v-if="temporaryList.length!=0">
				临时充电
			</view>
			<view :class="showclass=='3'?'sone':'sone1'" @click="tapbtn(3)" v-if="monthlyList.length!=0">
				包月充电
			</view>
			<view :class="showclass=='4'?'sone':'sone1'" @click="tapbtn(4)" v-if="isVIP.substr(0,1)=='V'">
				VIP模式
			</view>
		</view>

		<view class="map">
			<view class="mhand">
				<view style="width: 55%; text-align: left;">充电插座编号:{{shebeino}}:{{portnum}}</view>
				<view style="width: 20%;text-align: right;">{{infolist.module}}</view>
				<view style="width: 25%;text-align: right;">{{infolist.strength}}</view>
			</view>

			<view class="mtap" v-if="showclass=='1'">
				<view :class="tapclass=='1'?'mchu':'mchu1'" @click="handbtn(1)">
					充满自停
				</view>
				<view :class="tapclass=='2'?'mchu':'mchu1'" @click="handbtn(2)">
					4小时
				</view>
				<view :class="tapclass=='3'?'mchu':'mchu1'" @click="handbtn(3)">
					6小时
				</view>
				<view :class="tapclass=='4'?'mchu':'mchu1'" @click="handbtn(4)">
					8小时
				</view>
				<view :class="tapclass=='5'?'mchu':'mchu1'" @click="handbtn(5)">
					10小时
				</view>
				<view :class="tapclass=='6'?'mchu':'mchu1'" @click="handbtn(6)">
					<view v-if="tapclass!='6'">自定义</view>
					<view class="shuc" v-if="tapclass=='6'">
						<input type="number" v-model="handshu" placeholder="0" @input="onInput" />
						<view style="width: 40%;">小时</view>
					</view>
				</view>
			</view>

			<view class="mtap" v-if="showclass=='1'&&mtype=='B4'">
				<view>
					<view :class="tapclass2==firstOne?'mchu':'mchu1'" @click="handbtn2(firstOne)">
						{{firstOne}}元
						<view class="mfx" v-if="disFirstOne">优惠:{{disFirstOne*100}}%</view>
						<!-- <view class="mfx" v-if="!disFirstOne">优惠:无</view> -->
					</view>

				</view>
				<view>
					<view :class="tapclass2==secondOne?'mchu':'mchu1'" @click="handbtn2(secondOne)">
						{{secondOne}}元
						<view class="mfx" v-if="disSecondOne">优惠:{{disSecondOne*100}}%</view>
						<!-- <view class="mfx" v-if="!disSecondOne">优惠:无</view> -->
					</view>


				</view>

				<view>
					<view :class="tapclass2==thirdOne?'mchu':'mchu1'" @click="handbtn2(thirdOne)">
						{{thirdOne}}元
						<view class="mfx" v-if="disThirdOne">优惠:{{disThirdOne*100}}%</view>
						<!-- <view class="mfx" v-if="!disThirdOne">优惠:无</view> -->
					</view>


				</view>

				<view>
					<view :class="tapclass2==fourthOne?'mchu':'mchu1'" @click="handbtn2(fourthOne)">
						{{fourthOne}}元
						<view class="mfx" v-if="disFourthOne">优惠:{{disFourthOne*100}}%</view>
						<!-- <view class="mfx" v-if="!disFourthOne">优惠:无</view> -->
					</view>


				</view>

				<view>
					<view :class="tapclass2=='a'?'mchu':'mchu1'" @click="handbtn2('a')"
						style="margin-right: 224upx;box-sizing: border-box;font-size: 36upx;padding: 28upx 0;">
						<view v-if="tapclass2!='a'">自定义</view>
						<view class="shuc" v-if="tapclass2=='a'">
							<input type="number" v-model="handm" @input="onInput1" placeholder="0"
								style="width: 60%;" />
							<view style="width: 40%;">元</view>
						</view>
						<view class="mfx" style="margin-right: 224upx;" v-if="dishandm">优惠:{{dishandm*100}}%</view>
						<!-- <view class="mfx" style="margin-right: 224upx;" v-if="!dishandm">优惠:无</view> -->
					</view>

				</view>

			</view>
			<view class="mtap" v-if="showclass=='2'">
				<view>
					<view :class="tapclass1=='1'?'mchu':'mchu1'" @click="handbtn1(1)">
						{{first}}元
						<view class="mfx" v-if="temporaryDisFirst">优惠:{{temporaryDisFirst*100}}%</view>
						<!-- <view class="mfx" v-if="!temporaryDisSecond">优惠:无</view> -->
					</view>
				
				</view>
				<view>
					<view :class="tapclass1=='2'?'mchu':'mchu1'" @click="handbtn1(2)">
						{{second}}元
						<view class="mfx" v-if="temporaryDisSecond">优惠:{{temporaryDisSecond*100}}%</view>
						<!-- <view class="mfx" v-if="!temporaryDisSecond">优惠:无</view> -->
					</view>

				</view>
				<view>
					<view :class="tapclass1=='3'?'mchu':'mchu1'" @click="handbtn1(3)">
						{{third}}元
						<view class="mfx" v-if="temporaryDisThird">优惠:{{temporaryDisThird*100}}%</view>
						<!-- <view class="mfx" v-if="!temporaryDisThird">优惠:无</view> -->
					</view>

				</view>

				<view>
					<view :class="tapclass1=='4'?'mchu':'mchu1'" @click="handbtn1(4)">
						{{fourth}}元
						<view class="mfx" v-if="temporaryDisFourth">优惠:{{temporaryDisFourth*100}}%</view>
						<!-- <view class="mfx" v-if="!temporaryDisFourth">优惠:无</view> -->
					</view>

				</view>

			</view>

			<view class="mhand1" v-if="temporaryIsAutoStop==1 && showclass=='2'">
				<van-checkbox v-model="lscmchecked" :value="lscmchecked" @change="clickLscmchecked" shape="square"
					class="reset"></van-checkbox>
				<view style='margin-left: 30upx;'>
					<view>充满自停{{temporaryIsAutoStop}}</view>
				</view>
			</view>
			<view class="mhand1" v-if="isAutoStopOne == 1 && showclass=='1' && mtype=='B4'">
				<van-checkbox v-model="onecmchecked" :value="onecmchecked" @change="clickOnecmchecked" shape="square"
					class="reset"></van-checkbox>
				<view style='margin-left: 30upx;'>
					<view>充满自停 </view>
				</view>
			</view>

			<view class="mhand1" v-if="longshow == true && showclass != 4">
				<van-checkbox v-model="longcheck" :value="longcheck" shape="square" class="reset"
					@change="clickLongcheck"></van-checkbox>
				<view style='margin-left: 30upx;'>
					<view style='align-items: center;display: flex;'>长充模式<van-icon name="question-o"
							color="rgb(255, 160, 46)" style="margin-left: 20rpx;" @click='changbtn' /></view>
				</view>
			</view>
			<view class="mhand2" v-if="infolist.transfer==1">
				<van-checkbox v-model="checked" :value="checked" shape="square" class="reset"
					@change='bxbtn'></van-checkbox>
				<view style='margin-left: 30upx;'>
					<view>充电守护 ¥{{infolist.safeMoney}}<span style='margin-left: 20upx;' @click='bxxy'>《协议说明》</span>
					</view>
					<view style='color: #ababab;font-size:24upx;'>充电过程中自燃,最高可享{{infolist.bigMoney}}元补偿金</view>
				</view>
				<view class="mhand2img">
					<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//bxhand.png"></image>
				</view>
			</view>
			<view class="mhand1" v-if="xieyidata.display==1">
				<van-checkbox v-model="xychecked" :value="xychecked" @change="clickXychecked" shape="square"
					class="reset"></van-checkbox>
				<view style='margin-left: 30upx;'>
					<view style="color:#ababab;">我已阅读并同意<span style='margin-left: 20upx;color: rgb(240, 131, 0);'
							@click='clshow'>《{{xieyidata.agreementName}}》</span></view>
				</view>
			</view>
			<view class="mshow">
				<view class="tishi" v-if="showclass=='2'">
					<view v-for="(item, index) in temporaryList" :key="index">
						<view v-if="item.minPower!=item.maxPower">
							{{item.minPower}}瓦-- {{item.maxPower}}瓦{{item.standard}}元/小时,当前金额可充约
							<span style="color:#8DC321">{{((hsmoney/item.standard)*(1+hsfl)).toFixed(2)}}</span>小时
							<span v-if='hsfl'>,含赠送<span
									style="color:#8DC321">{{((hsmoney/item.standard)*hsfl).toFixed(2)}}</span>小时</span>

						</view>
						<view v-if="item.minPower==item.maxPower">
							{{item.maxPower}}瓦以上{{item.standard}}元/小时,当前金额可充约<span
								style="color:#8DC321">{{((hsmoney/item.standard)*(1+hsfl)).toFixed(2)}}</span>小时
							<span v-if='hsfl'>,含赠送<span
									style="color:#8DC321">{{((hsmoney/item.standard)*hsfl).toFixed(2)}}</span>小时</span>

						</view>

					</view>
					<view v-if="isFund==0" style="color: #F08300;">充电过程中如果中断充电{{ lscmchecked ? '或充满自停' : ''}}，不会退还剩余费用
					</view>
					<view v-if="isFund==1" style="color: #F08300;">
						充电过程中如果中断充电{{ lscmchecked ? '或充满自停' : ''}}，则会在6小时内退还剩余费用</view>
				</view>
				<view class="xza"
					v-if="isSpan==false&&showclass==1&&(mtype=='B2'||mtype=='B5')&&projectServiceDetailList.length>0">
					<view class="xza1">服务费
						<span v-if='xzchecked==1&&endTimeStr'>--服务费套餐截止：{{endTimeStr}}</span>
						<span v-if="xzchecked==2&&fuwumoney&&mtype=='B2'">--单次服务费金额：{{fuwumoney}}元/小时</span>
						<span v-if="xzchecked==2&&fuwumoney&&mtype=='B5'">--单次服务费金额：{{fuwumoney}}元/度</span>
					</view>
					<van-radio-group v-model="xzchecked" direction="horizontal">
						<van-radio name="1" :class="xzchecked==1?'xzb1':'xzb2'">套餐支付</van-radio>
						<van-radio name="2" :class="xzchecked==2?'xzb1':'xzb2'">单次支付</van-radio>
					</van-radio-group>
				</view>
				<view class="mslist" style="color: #F08300;font-size: 24upx;">
					安全提醒：请使用符合电动车厂家要求的充电器和电池进行充电，严禁任何私自改装车辆在本场地进行充电，否则造成的事故责任自行承担。</view>
				<view class="mslist">
					<view class="msleft">跨区消费:</view>
					<view class="msright" v-if="isSpan==false">本区</view>
					<view class="msright" v-if="isSpan==true" style="color:#8DC321;">跨区</view>
				</view>
				<view class="mslist" v-if="showclass!=4">
					<view class="msleft">计费模式:</view>
					<view class="msright" v-if="showclass==1">
						{{onetype}}
					</view>
					<view class="msright" v-if="showclass==2">{{twotype}}</view>
					<view class="msright" v-if="showclass==3">{{threetype}}</view>

				</view>
				<view class="mslist">
					<view class="msleft">小区名称:</view>
					<view class="msright">{{infolist.projectName}}</view>
				</view>
				<view class="mslist">
					<view class="msleft">充电区名称:</view>
					<view class="msright">{{infolist.areaName}}</view>
				</view>
				<view class="mslist">
					<view class="msleft">电话客服:</view>
					<view @click="kefutel(infolist.phone)" class="msright" style="color: #F08300;">{{infolist.phone}}
					</view>
				</view>
				<view class="mslist">
					<view class="msleft">微信客服:</view>
					<button class="msright btnkf" style="color: #F08300;" open-type="contact">点此马上联系</button>
				</view>
				<view class="mslist">
					<view class="msleft">查看费率:</view>
					<view class="msright" style="color: #F08300;" @click="flshowopen">点此查看费率</view>
				</view>
			</view>

		</view>
		<view class="dbtap" @click="faultshowopen">
			如果该设备不能正常使用，<span style="color: #F08300;">点此故障报修</span>告诉我们，我们尽快维修处理
		</view>

		<view class="double" v-if="infolist.transfer==1">
			<view class="leftbtn" @click="czbtn">账户充值</view>
			<view class="rightbtn" @click="cdbtn()" v-if="infolist.displayButton==0">
				<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/dian.png" v-if="bxname=='充电守护'"></image>
				{{bxname}}
			</view>
			<view class="zhongbtn" v-if="infolist.displayButton==1">
				<view class="zhongbtnone" v-if="checked==false && user_phone"  @click="cdbtn()">
					立即充电
				</view>
				<view class="zhongbtnone" v-if="checked==false && !user_phone"  open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
					立即充电
				</view>
				<view class="zhongbtntwo" v-if="checked==false" @click="cdbtn(1)">
					<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/dian.png"></image>无忧充电
				</view>
				<view class="zhongbtnthree" v-if="checked==true" @click="cdbtn(1)">
					<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/dian.png"></image>无忧充电
				</view>
			</view>
		</view>

		<view class="double" v-if="infolist.transfer==0">
			<van-button class="leftbtn" @click="czbtn"><text style="color: #ffffff !important;">账户充值</text></van-button>
			<van-button class="rightbtn" v-if="user_phone" @click="cdbtn()">
				<text style="color: #ffffff !important;">{{bxname}}</text>
			</van-button>
			<van-button class="rightbtn" v-if="!user_phone"  open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
				立即充电
			</van-button>
		</view>

		<van-popup :show="payment_type" round position="bottom" close-on-click-overlay="true" >
			<view class="paytt">
				支付方式
				<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/close.png" @click="paymentclose" class="close"></image>
			</view>

			<radio-group @change="radioChange">
				<view class="pay_typed" v-for="(item, index) in items" :key="item.value">
					<view><image :src="item.imgsrc" class="ico" mode="widthFix"></image>{{item.name}}<label style="color: #d6aa5f;font-size: 22rpx;">{{item.notes}}</label></view>
					<radio :value="item.value" :checked="item.value == current? 'checked':''" />
				</view>
			</radio-group>
			
			<view class="pay_btn" @click="lsshow()">确认支付</view>
		</van-popup>
			
		<view class="tan">
			<!-- //提示信息弹窗
			<van-popup :show="show" :close-on-click-overlay="false">
				<view class="tannei">
					<view class="tnhand">
						温馨提示
					</view>
					<view class="tnfoot" v-if="tanshow==1">
						<view class="tftxt">该设备{离线断网}，暂不可用，你可以: </view>
						<view class="tftxt">1、使用“验证码"充电;</view>
						<view class="tftxt">2、到“附近充电区"充电</view>
						<view class="tfshow">
							<view class="tfbtn color1" @click="showbtn">取消</view>
							<view class="tfbtn color2" @click="twoshowopen">验证码充电</view>
							<view class="tfbtn color3">附近电区</view>
						</view>
					</view>
					<view class="tnfoot" v-if="tanshow==2">
						<view class="tftxt">该设备{离线断网}，暂不可用，你可以: </view>
						<view class="tftxt">使用“验证码"充电;</view>
						<view class="tfshow">
							<view class="tfbtn1 color1" @click="showbtn">取消</view>
							<view class="tfbtn1 color2" @click="twoshowopen">验证码充电</view>
						</view>
					</view>
					<view class="tnfoot" v-if="tanshow==3">
						<view class="tftxt">该设备{离线断网}，暂不可用,</view>
						<view class="tftxt">请到“附近充电区"充电</view>
						<view class="tfshow">
							<view class="tfbtn1 color1" @click="showbtn">取消</view>
							<view class="tfbtn1 color3" @click="nearbtn">附近电区</view>
						</view>
					</view>
					<view class="tnfoot" v-if="tanshow==4">
						<view class="tftxt">{{fourmsg}}</view>
						<view class="tfshow">
							<view class="tfbtn2 color3" @click="showbtn">确定</view>
						</view>
					</view>
				</view>
			</van-popup>
			<!-- //查看费率弹窗 -->
			<van-popup :show="flshow">
				<view class="tannei1">
					<view class="tnhand">
						<view class="tntxt">查看费率</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/close.png" @click="flshowclose"></image>
					</view>
					<view class="tnfoot" v-if="displayScheme == 1">
						<view class="tfshang" v-if="deviceId.substr(-2,1)!=9">当前充电桩服务费如下:</view>
						<view class="tfshang" v-if="deviceId.substr(-2,1)==9">当前充电柜费率如下:</view>
						<view class="tfxia">
							<view v-for="(item, index1) in oftenList" :key="index1" v-if="showclass==1">
								<view v-if="item.types=='B2'">
									电费:{{item.standard}}元/度
								</view>
								<view v-if="item.types=='B5'">
									电费:{{item.standard}}元/度
								</view>
								<view v-if="item.types=='B1'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{(item.standard * 0.48).toFixed(2)}}元/小时
									</view>
									<view v-if="item.minPower==item.maxPower">
										{{item.maxPower}}瓦以上{{(item.standard * 0.48).toFixed(2)}}元/小时
									</view>
								</view>
								<view v-if="item.types=='B6'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{(item.standard)}}元/小时
									</view>
									<view v-if="item.minPower==item.maxPower">
										{{item.maxPower}}瓦以上{{(item.standard)}}元/小时
									</view>
								</view>
								<view v-if="item.types=='B3'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/次
									</view>
									<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上{{item.standard}}元/次
									</view>
								</view>
								<view v-if="item.types=='B4'">
									<view v-if="item.minPower!=item.maxPower">{{item.minPower}}瓦--{{item.maxPower}}瓦
										1元{{item.standard}}小时</view>
									<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上
										1元{{item.standard}}小时</view>
								</view>
							</view>
							<view v-for="(item, index2) in temporaryList" :key="index2" v-if="showclass==2">
								<view v-if="item.minPower!=item.maxPower">
									{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/小时
								</view>
								<view v-if="item.minPower==item.maxPower">{{item.maxPower}}瓦以上{{item.standard}}元/小时
								</view>
							</view>

							<view v-for="(item, index3) in monthlyList" :key="index3" v-if="showclass==3">
								<view v-if="item.types=='A1'">

									<view>{{item.standard}}元/{{item.numStr}}小时/月</view>
								</view>
								<view v-if="item.types=='A3'">

									<view>{{item.standard}}元/{{item.numStr}}次/月</view>
								</view>
								<view v-if="item.types=='A4'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/30天{{item.numStr}}小时
									</view>
									<view v-if="item.minPower==item.maxPower">
										{{item.maxPower}}瓦以上{{item.standard}}元/30天{{item.numStr}}小时
									</view>
								</view>
								<view v-if="item.types=='A6'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/30天{{item.numStr}}次
									</view>
									<view v-if="item.minPower==item.maxPower">
										{{item.maxPower}}瓦以上{{item.standard}}元/30天{{item.numStr}}次
									</view>
								</view>
								<view v-if="item.types=='A5'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/天{{item.numStr}}小时
									</view>
									<view v-if="item.minPower==item.maxPower">
										{{item.maxPower}}瓦以上{{item.standard}}元/天{{item.numStr}}小时
									</view>
								</view>
								<view v-if="item.types=='A7'">
									<view v-if="item.minPower!=item.maxPower">
										{{item.minPower}}瓦--{{item.maxPower}}瓦{{item.standard}}元/天{{item.numStr}}次
									</view>
									<view v-if="item.minPower==item.maxPower">
										{{item.maxPower}}瓦以上{{item.standard}}元/天{{item.numStr}}次
									</view>
								</view>
							</view>
							<view v-if="showclass==1&&mtype=='B2'"
								style="color: #F08300;text-align: left;margin-left:36upx">
								服务费费率:{{fwnum}}元/小时
							</view>
							<view v-if="showclass==1&&mtype=='B5'"
								style="color: #F08300;text-align: left;margin-left:36upx">
								服务费费率:{{fwnum}}元/度
							</view>
							<view v-if="showclass==1&&mtype=='B6'"
								style="color: #F08300;text-align: left;margin-left:36upx">
								电量费率:{{powerRate == '' ? 0.62 : powerRate}}元/度
							</view>
							<view v-if="showclass==1&&mtype!='B4'"
								style="color: #F08300;text-align: left;margin-left:36upx">
								最低消费:￥{{oftenMinMoney}}元
							</view>
							<view v-if="showclass==2" style="color: #F08300;text-align: left;margin-left:36upx">
								最低消费:￥{{temporaryMinMoney}}元
							</view>
							<view v-if="deviceId.substr(-2,1)==9">
								<view v-if="showclass==1">
									<view>占位费免费时长(小时):{{oftenOccupyFree}}</view>
									<view>占位费封顶金额:￥{{oftenOccupyMax}}元</view>
									<view>占位费率:{{oftenOccupyRate}}</view>
								</view>
								<view v-if="showclass==2">
									<view>占位费免费时长(小时):{{temporaryOccupyFree}}</view>
									<view>占位费封顶金额:￥{{temporaryOccupyMax}}元</view>
									<view>占位费率:{{temporaryOccupyRate}}</view>
								</view>
								<view v-if="showclass==3">
									<view>占位费免费时长(小时):{{monthlyOccupyFree}}</view>
									<!-- <view>占位费封顶金额:￥{{monthlyOccupyMax}}元</view> -->
									<view>占位费率:{{monthlyOccupyRate}}</view>
								</view>
							</view>
						</view>
						<view class="tfxia" v-if="(mtype=='B1' || mtype=='B6') &&showclass=='1'"
							style="color: #F08300;text-align: left;margin-left:36upx">
							<view v-if="(mtype=='B1')">
								<view>1、电费0.62元/度；</view>
								<view>2、开始充电5分钟内终止充电不计费；</view>
							</view>
							<view v-if="(mtype=='B6')">
								<view>开始充电5分钟内终止充电不计费；</view>
							</view>
							<!-- <br />2、开始计费后不足30分钟按30分钟计费； -->
						</view>
						<view v-if="flremarks1&&showclass==1">
							<view class="tfshang1">温馨提示:</view>
							<view class="tfxia1">{{flremarks1}}</view>
						</view>
						<view v-if="flremarks2&&showclass==2">
							<view class="tfshang1">温馨提示:</view>
							<view class="tfxia1">{{flremarks2}}</view>
						</view>
						<view v-if="flremarks3&&showclass==3">
							<view class="tfshang1">温馨提示:</view>
							<view class="tfxia1">{{flremarks3}}</view>
						</view>

					</view>
					
					<view class="tnfoot" v-if="displayScheme == 2">
						<view class="tfshang" v-if="deviceId.substr(-2,1)!=9">当前充电桩收费如下:</view>
						<view class="tfxia">
							<view>
								<view>
									电费:0.62元/度
								</view>
								<view>
									服务费:1.18元/度
								</view>
							</view>
						</view>		
					</view>	
				</view>
			</van-popup>
			<!-- //微信二维码弹窗 -->
			<van-popup v-model="wxshow">
				<view class="tannei1">
					<view class="tnhand">
						<view class="tntxt">客服微信</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="wxshowclose"></image>
					</view>
					<view class="tnfoot">
						<view class="wxcodeimg">
							<image :src="erimg"></image>
						</view>
						<view class="wxtxt">
							长按可以识别二维码，可以直接加微信客服沟通哦
						</view>
					</view>
				</view>
			</van-popup>
			<!-- //验证码弹窗提示 -->
			<van-popup v-model="twocodeshow">
				<view class="tannei2">
					<view class="tnhand">
						<view class="tntxt">提示</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="twoshowclose">
						</image>
					</view>
					<view class="tnfoot">
						<view class="yancodetxt">
							当前设备断网，请使用验证码充电!
						</view>
						<view class="yannum">
							{{yzcode}}
						</view>
						<!-- <view class="yztap">
							<view class="yanbtn" v-if="Verification" @click="handleClick">获取验证码</view>
							<view class="yanbtn" v-if="!Verification"><span>{{timer}}</span>s</view>
						</view> -->
						<view class="yzhand">
							操作说明
						</view>
						<view class="yzfoot">
							<view class="tzfootleft">
								<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//btnnum.png"></image>
							</view>
							<view class="tzfootright">
								1点击上方的获取验证码;<br />
								2点击设备的取消健返回初始界面;<br />
								3.在设备键盘上输入验证码编号;<br />
								4输入完之后请点击确认按钮:
							</view>
						</view>
					</view>
				</view>
			</van-popup>
			<!-- //端口选择弹窗提示 -->
			<van-popup :show="duanshow" :close-on-click-overlay='false'>
				<view class="tannei2">
					<view class="tnhand">
						<view class="tntxt">选择端口</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//close.png" @click="duanshowclose">
						</image>
					</view>
					<view class="tnfoot">
						<view class="duanlist">
							<view :class="mshow==index?'duantap':'duantap1'" v-for="(item, index) in montlist"
								:key="index" @click="montbtn(index)">
								{{item}}
							</view>
						</view>

					</view>
					<view class="tnhand" v-if='showclass==2' style="height: 100%;">
						<view class="tntxt">请选择端口进行充电,或点击取消进行退款,退出页面将延迟退款</view>
					</view>
					<view class="tfshow">
						<view class="tfbtn1 color1" @click="duanshowclose"><span v-if='showclass==2'>取消并退款</span><span
								v-if='showclass==1||showclass==3'>取消</span></view>
						<view class="tfbtn1 color2" @click="dkshowbtn">确认</view>
					</view>
				</view>
			</van-popup>

			<!-- //初始化ff端口选择弹窗提示 -->
			<van-popup :show="oneshow" :close-on-click-overlay='false'>
				<view class="tannei2">
					<view class="tnhand">
						<view class="tntxt">选择端口</view>
					</view>
					<view class="tnfoot">
						<view class="tfone" style="padding-top: 14upx;">设备编号：{{sixnum}}</view>
						<view class="tfone">请选择插座编号(充电器所插入的编号);</view>

						<view class="duanlist1">
							<view v-for="(item, index) in onelist" :key="index" @click="montbtn1(index,item.status)">
								<view v-if="item.status&&item.status=='空闲'" class="duantap1 port0">
									<view>{{item.port}}</view>
									<view>{{item.status}}</view>
								</view>
								<view v-if="item.status&&item.status=='禁用'" class="duantap1 port7">
									<view>{{item.port}}</view>
									<view>{{item.status}}</view>
								</view>
								<view v-if="item.status&&item.status=='绑定'" class="duantap1 port88">
									<view>{{item.port}}</view>
									<view>{{item.status}}</view>
								</view>
								<view v-if="item.status&&item.status=='充电中'" class="duantap1 port4">
									<view>{{item.port}}</view>
									<view>{{item.status}}</view>
								</view>
								<view v-if="item.status&&item.status=='已充满'" class="duantap1 port3">
									<view>{{item.port}}</view>
									<view>{{item.status}}</view>
								</view>
								<view v-if="!item.status" class="duantap1"
									style="color: #6f6f6f;border-color: #6f6f6f;">
									<view style="line-height: 88upx; ">{{item.port}}</view>
								</view>

							</view>
						</view>

					</view>
					<view class="tquxiao">
						<view @click="back">取消</view>
					</view>
				</view>
			</van-popup>
			<!-- //故障报修弹窗 -->
			<van-popup :show="faultshow">
				<view class="tannei2">
					<view class="tnhand">
						<view class="tntxt">故障维修</view>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/close.png" @click="faultshowclose">
						</image>
					</view>
					<view class="kshow">
						<view class="kone">
							<input placeholder="设备编号" v-model="sbnum" />
						</view>
						<view class="ktwo">
							<van-collapse :value="activeNames" @change="clickActiveNames">
								<van-collapse-item :title="reason" name="1" :title-class="classtap">
									<van-radio-group :value="radio1" @change="gobtn">
										<van-radio name="提示设备断网">提示设备断网</van-radio>
										<van-radio name="设备断电，设备上指示灯不亮">设备断电，设备上指示灯不亮</van-radio>
										<van-radio name="设备语音播报故障，重复报数">设备语音播报故障，重复报数</van-radio>
										<van-radio name="设备端口故障，直通电">设备端口故障，直通电</van-radio>
										<van-radio name="其他">其他</van-radio>
									</van-radio-group>
								</van-collapse-item>
							</van-collapse>
						</view>
						<view class="kthree">
							<view class="kthreehand">
								故障描述：<span class="khtxttwo">（200字以内）</span>
							</view>
							<view class="kthreefoot">
								<van-field :value="message" @change="changeMessage" rows="2" autosize type="textarea"
									maxlength="200" />
							</view>
						</view>
						<view class="kfour">
							<view class="kfourtxt">
								图片上传：<span class="kfourbud">限制3张</span>
							</view>
							<view class="kfourfoot">
								<view class="add-img-box">
									<view class="add-img-item" v-for="(item, index) in imgList" :key="index">
										<image class="add-img" @click="imgInfo(index)" :src="item.path"
											mode="aspectFill"></image>
										<image class="add-img-del" @click="delImg(index)"
											src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//delete.png"></image>
									</view>
									<view v-if="imgList.length < 3 " class="add-img-item" @click="openCamera">
										<image class="add-img"
											src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//add.png"></image>
									</view>
								</view>
							</view>
						</view>
						<view class="kbtn" @click="kbtngo">
							确认
						</view>
					</view>
				</view>
			</van-popup>
			<!-- 提交错误 -->
			<van-popup :show="tishishow">
				<view class="tishione" @click="kbtngoclose">
					您的故障报修已成功提交，我们会尽快派人跟进和处理，处理结果我们会微信通知您，如需充电请更换另外一台设备，感谢您的支持和配合；
				</view>
			</van-popup>
			<!-- 新人指引弹窗 -->
			<van-popup :show="gbshow" :close-on-click-overlay="false">
				<view class="tanshi" style="padding: 70upx 0;">
					<view class="xz">

						<view class="xzone" style="font-size: 30upx;">您选择的包月充电套餐与功率不一致,继续充电可能会断电,确认继续充电吗？</view>
						<view class="xztwo" style="font-size: 26upx;" @click="bygo">点击立刻升级套餐>>></view>

					</view>
					<view class="anniu" style="margin-top: 80upx;">
						<view class="anniu1" @click="bycolose">取消</view>
						<view class="anniu1" @click="byque">确认</view>
					</view>
				</view>

			</van-popup>


			<!-- 新人指引弹窗 -->
			<van-popup :show="dshow" :close-on-click-overlay="false">
				<view class="tanshi">
					<view class="xz">
						<image src="https://qiniu.jxyutuo.com/yanqin/zhiyin/dcar.png"></image>
						<view class="xzone">欢迎使用智能充电充电系统</view>
						<view class="xztwo">接下来</view>
						<view class="xztwo">我们将为您展示一些重要功能的操作指引</view>
						<view class="xzthree">再次查看,请进入"个人中心-使用帮助-操作指引"</view>
					</view>
					<view class="anniu">
						<view class="anniu1" @click="colosezhi">跳过</view>
						<view class="anniu1" @click="gozhi">接受</view>
					</view>
				</view>

			</van-popup>


			<van-popup :show="timeshow" :close-on-click-overlay='false'>
				<view class="tannei2">
					<view style="font-size: 30upx;font-weight: 700;text-align: center;margin: 20upx 0;">
						提示
					</view>
					<view
						style="font-size: 25upx;font-weight: 700;color: #555555;text-align: center;box-sizing: border-box;padding: 10upx 30upx;line-height: 50upx;">
						'温馨提示', 因网络原因，您此次充电可能不成功，
						如已开始充电，请留意随后的微信消息提示，如未开始充电，请重试一次<span style='color: red;'>(临时充电支付款项将在30分钟内退回)</span>
					</view>
					<view class="tfshow">
						<view class="tfbtn1 color1" @click="timebtn">取消</view>
						<view class="tfbtn1 color2" @click="timebtn">确认</view>
					</view>
				</view>
			</van-popup>
			<!-- //充值协议 -->

			<van-popup :show="cshow">
				<view class="czone">
					<view class="cznei">
						<view class="czneihand">
							协议
						</view>
						<view class="czneione">
							<view class="cztxtone">
								本服务协议（以下简称“本协议”），{{infolist.safeCompany}}充电平台用户（以下简称“您”），就您使用充电平台充电有关事宜所订立的有效合约。
								请您务必审慎阅读、充分理解各条款内容，特别是免除或者限制责任的条款。
								一旦您点击确认接收全部的条款和条件，即表示您已接受了以下所述的条款和条件，同意接受本协议约束。阅读本协议的过程中，如果您不同意本协议或其中任何条款约定，您将无法订购使用充电守护服务。
							</view>
							<view class="cztxttwo">
								1. 定义
							</view>
							<view class="cztxtone">
								1.1
								充电守护：指您在充电平台进行充电的同时购买充电守护服务。充电守护不是保险，是为特定客户提供的一项有偿增值服务，充电平台据此支付的款项不是保险金，是您在充电平台进行充电的过程中，您的充电车辆发生自燃时支付的补偿金。
							</view>
							<view class="cztxtone">
								1.2 用户：是指在平台上发起充电服务需求的具有完全民事权利能力和行为能力的自然人。
							</view>
							<view class="cztxttwo">
								2. 服务购买方式
							</view>
							<view class="cztxtone">
								2.1
								用户在充电平台进行充电的同时购买充电守护服务。除本协议另有约定外，在您支付成功后，如充电的过程中您的充电车辆发生自燃，{{infolist.safeCompany}}需向您支付一定金额的补偿金。补偿金金额以在平台充电页面展示为准（补偿金金额上限为{{infolist.bigMoney}}元，如因自燃导致其他损失不在此补偿范围之内）。
							</view>
							<view class="cztxtone">
								2.2 仅充电页面可购买充电守护服务。
							</view>
							<view class="cztxtone">
								2.3 仅充电正常开启且充电过程中充电车辆发生自燃可执行赔付规则。
							</view>
							<view class="cztxttwo">
								3. 用户的权利和义务
							</view>
							<view class="cztxtone">
								3.1 充电守护服务售出后不可申请退款。
							</view>
							<view class="cztxtone">
								3.2 您因充电守护服务而获赔的补偿金，将支付至您的微信零钱包。
							</view>
							<view class="cztxtone">
								3.3 非人为因素（改装车辆等）、车辆电池和充电器质量问题等发生的充电过程中自燃可享受赔付的补偿金。
							</view>
							<view class="cztxtone">
								3.4 如您有采取欺骗方式获取补偿金的行为时，{{infolist.safeCompany}}有权要求您退回补偿金，并保留追究您法律责任的权力。
							</view>
							<view class="cztxttwo">
								4. 免责条款
							</view>
							<view class="cztxtone">
								4.1
								{{infolist.safeCompany}}依照法律规定履行基础保障义务，但对于下述原因导致的合同履行障碍、履行瑕疵、履行延后或履行内容变更等情形，{{infolist.safeCompany}}不支付补偿金：
							</view>
							<view class="cztxtone">
								4.1.1 因自然灾害、罢工、暴乱、战争、政府行为、司法行政命令等不可抗力因素；
							</view>
							<view class="cztxtone">
								4.1.2 因电力供应故障、通讯网络故障等公共服务因素或第三人因素；
							</view>
							<view class="cztxtone">
								4.1.3 在{{infolist.safeCompany}}已尽善意管理的情况下，因常规或紧急的设备与系统维护、设备与系统故障、网络信息与数据安全等因素。
							</view>
							<view class="cztxttwo">
								5. 法律适用和争议解决
							</view>
							<view class="cztxtone">
								5.1 本协议之订立、生效、解释、修订、补充、终止、执行与争议解决均适用中华人民共和国大陆地区法律。
							</view>
							<view class="cztxtone">
								5.2
								用户因充电守护服务有关的争议，由{{infolist.safeCompany}}与用户协商解决。协商不成时，任何一方均可向{{infolist.safeCompany}}所在地人民法院提起诉讼。
							</view>

						</view>
					</view>
					<view class="czdel" @click="cshowclose(2)">
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/delete.png"></image>
					</view>
				</view>
			</van-popup>
			<!-- //充值协议 -->

			<van-popup :show="cxyshow">
				<view class="czone">
					<view class="cznei">
						<view class="czneione">
							<view v-html="xieyidata.agreementContents"></view>
						</view>
					</view>
					<view class="czdel" @click="clshowclose">
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg/delete.png"></image>
					</view>
				</view>
			</van-popup>

			<van-popup :show="gzshow" @close="gzshow=false">
				<view class="gztan">
					<view class="gztanimg">
						<img :src="wechaturl"></img>
						<!-- <img src='https://qiniu.jxyutuo.com/yanqin/tabBarimg//00000006.jpg'></img> -->
					</view>
					<view class="gztantxt">
						长按识别二维码，关注公众号，接收充电消息通知
					</view>
				</view>
			</van-popup>
			<!-- //购买服务费套餐 -->
			<van-popup :show="fwtan" @close="fwtan=false">
				<view class="tannei2">
					<view class="tnhand">
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//shanchu.png" @click="fwfeiclose"
							style="width: 50upx;height: 50upx;"></image>
					</view>
					<view class="fwfei" v-for="(item, index) in projectServiceDetailList" :key="index">
						<view class="fwfeileft">{{item.rates}}元{{item.days}}天</view>
						<view class="fwfeiright" @click="buyfuwu(item.id)">购买</view>
					</view>
				</view>
			</van-popup>

			<van-popup :show="warnshow" :close-on-click-overlay='false'>

				<view class="xytanshi">
					<view class="shdun" v-if='warnshow'>
						<image src="https://qiniu.jxyutuo.com/yanqin/tabBarimg//dun.png"></image>
					</view>
					<view class="plustore">
						<view class="plustoreone">已有<span>{{yonghunum}}</span>位用户购买了 充电守护</view>
						<view class="plustoretwo">选择守护充电，可防患于未“燃”哦</view>
					</view>
					<view class="pantap">
						<view class="pantapone" @click="bxcolose">普通充电</view>
						<view class="pantaptwo" @click="bxque">守护充电</view>
					</view>
				</view>
			</van-popup>
		</view>
		<view class="occtan">
			<van-popup :show="occshow" :close-on-click-overlay='false'>
				<view class="occmap">
					<view class="occfoot" v-for="(item, index) in occlist" :key="index">
						<view class="occfootone">
							<span>订单号:</span>{{item.orderNum}}
						</view>
						<view class="occfootone" style="display: flex;">
							<view><span>设备编号:</span>{{item.code}}</view>
							<view><span style="margin-left: 50upx;">端口号:</span>{{item.port}}</view>
						</view>

						<view class="occfootone">
							<span>开柜密码:</span>{{item.password}}
						</view>
					</view>
					<view class="occdibu">
						<view class="occdibuone" @click="know">
							我已知晓(不再提示)
						</view>
						<view class="occdibutwo" @click="knowclose">
							关闭
						</view>
					</view>
				</view>
			</van-popup>
		</view>
	</view>
</template>

<script>
	import {
		Config
	} from '../../common/Config.js'
	import clickThrottle from "../../common/clickThrottle.js"
	import Dialog from '../../wxcomponents/dist/dialog/dialog';
	export default {
		components: {},
		data() {
			return {
				powerRate: '',
				showclass: '1', //模式选择
				tapclass: '1', //小时选择
				tapclass2: '', //金额选择
				payment_type: false, //支付方法提示弹窗显示
				show: false, //提示弹窗显示
				tanshow: 1, //弹窗按钮显示
				flshow: false, //查看费率弹窗显示
				wxshow: false, //微信二维码弹窗显示
				erimg: '', //二维码图片
				twocodeshow: false, //验证码弹窗显示
				Verification: true, //通过v-if控制显示获取还是倒计时
				timer: 60, //定义初始时间为60s
				duanshow: false, //端口选择弹窗显示
				montlist: ['1号端口', '2号端口'],
				mshow: 0,
				mshow1: -1,
				faultshow: false, //故障报修弹窗显示
				radio: '1', //退款类型
				activeNames: [''],
				radio1: '', //退款原因
				message: '', //故障描述
				reason: '请选择故障类型',
				imgList: [],
				cloudimgList: [],
				imgCount: 3, //最多支持3张上传，可以修改
				tishishow: false,
				option: {}, //页面传参
				infolist: {}, //页面数据
				monthlyList: [], //包月费率详情数组
				temporaryList: [], //临时费率详情数组
				oftenList: [], //常用模式费率详情数组
				onetype: "", //常用计费模式
				twotype: "", //临时计费模式
				threetype: "", //包月计费模式
				minMoney: "", //最低消费金额
				time: 0, //选择的时长
				handshu: '', //手动输入时长
				handm: '', //手动输入金额
				dishandm: 0, //手动输入金额优惠率
				chargeType: "", //上电类型
				isSpan: '', //是否跨区
				numm: 0, //重连websocket的次数
				ws: null, //websocket连接成功的对象
				webIsTrue: false, //websocket是否连接
				timeId: 0,
				from: '', //标识  从哪跳过来的   1代表外部扫一扫 2代表内部扫一扫 或远程上电
				first: '', //临时第一档
				second: '', //临时第二档
				third: '', //临时第三档
				fourth: '', //临时第四档
				tapclass1: '1',
				areaId: '', //充电区ID
				projectId: '', //小区id
				yzcode: '', //验证码
				yzdata: {}, //获取验证码参数
				nearid: '', //跳转ID
				fourmsg: '', //500提示信息
				portnum: '', //端口号显示
				userId: '', //用户id
				amount: '', //临时充值金额
				rechargeNo: '', //临时充值订单号
				dknum: '00', //选择的端口号
				hat: [], //设备报修图片
				sbnum: '', //设备报修编号
				shebeino: '', //设备编号
				hsmoney: '', //选中金额
				hsfl: '', //选中费率
				flremarks1: '', //常用费率弹窗提示信息
				flremarks2: '', //临时费率弹窗提示信息
				flremarks3: '', //包月费率弹窗提示信息
				oftenMinMoney: '', //常用模式最低消费
				temporaryMinMoney: '', //临时模式最低消费
				deviceId: '', //16进制端口号
				noticeMsg: "",
				classtap: 'tclass',
				oneshow: false, //初始化ff端口选择
				onelist: [], //端口数据
				oneport: '', //端口号
				sixnum: '', //转换后的设备号
				isFund: '', //是否临时退费
				posterList: [], //轮播图数组
				poster: 0,
				dshow: false, //指引提示
				mtype: '', //常用模式状态
				bytype: '', //包月模式状态
				firstOne: '', //一元第一档
				secondOne: '', //一元第二档
				thirdOne: '', //一元第三档
				fourthOne: '', //一元第四档
				disFirstOne: '', //一元第一档优惠率
				disSecondOne: '', //一元第二档优惠率
				disThirdOne: '', //一元第三档优惠率
				disFourthOne: '', //一元第四档优惠率
				temporaryDisFirst: '', //临时第一档优惠率
				temporaryDisSecond: '', //临时第二档优惠率
				temporaryDisThird: '', //临时第三档优惠率
				temporaryDisFourth: '', //临时第四档优惠率
				gbshow: false,
				timeshow: false,
				dgnum: '',
				occtype: 0, //是否有充电柜订单
				cdgnum: '', //充电柜未完成订单数量
				oftenOccupyFree: 0, //常用免费时长-小时（充电柜）
				oftenOccupyMax: 0, //常用占位费封顶金额
				oftenOccupyRate: 0, //常用占位费率（充电柜）
				temporaryOccupyFree: 0, //临时免费时长-小时（充电柜）
				temporaryOccupyMax: 0, //临时占位费封顶金额
				temporaryOccupyRate: 0, //临时占位费率（充电柜）
				monthlyOccupyFree: 0, //包月免费时长-小时（充电柜）
				monthlyOccupyMax: 0, //包月占位费封顶金额
				monthlyOccupyRate: 0, //包月占位费率（充电柜）
				wtype: 0, //未完成订单弹窗是否弹出
				imglogo: '',
				checked: true, //勾选
				isSafe: 0, //是否开启无忧充电 0否1是
				bxname: '立即充电',
				cshow: false,
				yc: 0, //是否远程充电
				fwnum: '', //常用计量服务费费率
				bhdk: '', //宝付端口
				refundId: 0, //退款定时
				gzshow: false,
				wechatLogo: '', //是否显示公众号二维码
				wechaturl: '', //是否显示公众号二维码
				xieyidata: {}, //用户协议
				cxyshow: false,
				xychecked: false,
				onecmchecked: false, //一元是否充满自停勾选
				isAutoStopOne: 0, //一元是否充满自停
				lscmchecked: false, //临充是否充满自停勾选
				temporaryIsAutoStop: 0, //临充是否充满自停
				longcheck: false, //是否开启长充模式
				longshow: false, //是否显示长充模式
				longCharge: 0,
				xcxtype: 0, //0小程序环境 1公众号环境
				xzchecked: '2', //1 服务费套餐 2单独收费
				fwtan: false, //服务费套餐弹窗
				serviceType: '', //服务费类型
				projectServiceDetailList: [], //服务费套餐列表
				endTimeStr: '', //计量服务费包月到期时间
				fuwumoney: '', //单次服务费金额
				isVIP: '', //VIP状态
				warnshow: false,
				yonghunum: '', //充电守护人数
				occlist: '', //用户强制结算的充电柜订单
				occshow: false,
				occas: 1, //守护充电勾选
				xuanbtn: '',
				burl: '',
				ontime: 0,
				temporaryDefaultAutoStop: 0, // 默认勾选充满自停
				wechat_view: [], //公众号信息
				user_phone: '', //用户手机号
				items: [{
						value: '1',
						imgsrc: '/static/wx.png', 
						name: '微信',
						checked: 'true'
					}
					,
					 {
					 	value: '6',
					 	imgsrc: '/static/yl.png',
						name: '云闪付',
					    notes:'“满1元立减0.99元”，最低1分钱充电'
					 }
				],
				current: 1,
				merOrderId: '', //银联支付时，商户订单ID,
				displayScheme: 1, //计费模式
			}
		},
		watch: {
			xzchecked(newcheck, old) {
				if (newcheck == '1' && !this.endTimeStr && this.projectServiceDetailList.length > 0) {
					this.fwtan = true
				}
			}
		},
		onLoad(option) {
			//安全承诺书
			this.xy();
			this.gettyeps();
			if (option.yc) {
				//判断是否远程充电
				this.yc = option.yc;
			} else {
				this.yc = 0
			}
			this.option = option;

			var sbno = this.option.device.substring(this.option.device.length - 2, this.option.device.length)
			if (this.option.cmd == 0 && sbno == '00') {
				var data = {
					portDevice: this.option.device
				}

				this.$base.request('charge/device', 'GET', data)
					.then(res => {
						if (res.data.code == 200) {
							this.option.device = res.data.data.deviceId
							this.option.port = res.data.data.ports
							this.showone()
						} else {
							this.$toast.fail('此二维码未绑定到充电桩！')
							this.back();
							return
						}
					})
					.catch(err => {

					})
			} else {
				this.showone()
			}
			
			this.initSocket();
		},

		onShow: function(res) {
			wx.onAppShow((res2)=>{
				console.log(res2);
				if(res2.scene == 1038){
					console.log(this.merOrderId);
					//this.initSocket();
					uni.showLoading({
						title: '请稍候',
						mask: true
					})
					wx.offAppShow(res2)
					setTimeout(() => {
						var data = {
							orderNum: this.merOrderId,
						}
						this.$base.request('order/checkTempRechargePayStatus', 'GET', data)
							.then(res3 => {
								if (res3.data.code == 200) {
									uni.redirectTo({
										url: '/pages/chargingzhong/chargingzhong'
									})
									uni.hideLoading();
								} else {
									this.$toast.fail(res3.data.msg);
									//this.timeshow = false
									uni.hideLoading();
								}
							})
							.catch(err => {
						
							})
					}, 3000);
					
				}
				wx.offAppShow(res2);
			})
			
			//公众号信息
			this.get_wechat_view();
			if (this.option.device.substr(-2, 1) == 9 && this.option.cmd != 1 && this.wtype == 0) {
				this.deviceId = this.option.device.toUpperCase()
				this.occfirst()
			}
			
			
		},
		beforeDestroy() {
			// if (this.webIsTrue) {
			// 	this.socketTask.close()
			// 	this.socketTask = null
			// }
			if (this.showclass == 2 && this.duanshow == true) {
				clearTimeout(this.refundId)
				let data = {
					ornum: this.ornum
				}
				uni.showLoading({
					title: '请稍候',
					mask: true
				})
				this.$base.request('refund/refund', 'POST', data)
					.then(res1 => {
						if (res1.data.code == 200) {
							uni.hideLoading()
							this.$toast.success('退款成功')
							this.back()
						} else {
							this.$toast.fail(res1.data.msg)
							this.back()
						}
					})
					.catch(err => {

					})
			}
		},
		methods: {
			async getPhoneNumber(e){
				 let that = this
				 // console.log(e.detail.code)  // 动态令牌
				 // console.log(e.detail.errMsg) // 回调信息（成功失败都会返回）
				 // console.log(e.detail.errno)  // 错误码（失败时返回）
				 if(e.detail.errMsg == 'getPhoneNumber:ok'){
					 let data = {
					 	code: e.detail.code
					 }
					that.$base.request('user/bindWechatPhone', 'POST', data)
						.then(res => {
							if (res.data.code == 200) {
								var view = res.data.data;
								if (view.phone) {
									that.user_phone = view.phone;
									var user = uni.getStorageSync('user');
									user.phone = view.phone;
									uni.setStorageSync('user', user);
									// that.cdbtn();
								}
							} else {
								that.$toast.fail(res.data.msg)
							}
						})
						.catch(err => {
					
						})
				 }
				 that.cdbtn();
			},
			gettyeps(){
				const that = this;
				let userinfo = uni.getStorageSync('user');
				let data = {
					projectId: userinfo.projectId
				}
				that.loading = true;
				that.$base.request('project/getInfo', 'POST', data)
					.then(res => {
						that.displayScheme = res.data.data.displayScheme
					})
					.catch(err => {
				
					})
			},
			radioChange: function(evt) {
					for (let i = 0; i < this.items.length; i++) {
						if (this.items[i].value === evt.detail.value) {
							this.current = evt.detail.value;
							console.log(this.current);
							break;
						}
					}
			},

			showone() {
				var fone = this.option.device.substring(this.option.device.length - 2, this.option.device.length)
				var ftwo = this.option.port
				this.dgnum = this.option.device.substr(-2, 1)
				this.bhdk = this.option.port
				if (((fone == '05' || fone == '06' || fone == '07') && (ftwo == 'ff' || ftwo == 'FF')) || (this.option
						.from == 3) || (this.dgnum == 9 && this.option.cmd == 0)) {
					// this.oneshow = true
					if (this.dgnum != 9) {
						this.oneshow = true
					} else {
						if (this.option.cmd == 1) {
							this.oneshow = true
						}
					}
					var data = {
						fromType: this.option.from,
						deviceId: this.option.device
					}
					this.$base.request('charge/ports', 'GET', data)
						.then(res => {
							if (res.data.code == 200) {
								this.onelist = res.data.data.ports
								this.sixnum = res.data.data.device
							} else {
								this.$toast.fail('端口异常，请稍后再试！')
								this.back();
							}
						})
						.catch(err => {

						})
				} else {
					this.oneport = this.option.port
					var port = Number(this.oneport) + 1
					var t = (port + '').length
					var s = ''
					for (var i = 0; i < 2 - t; i++) {
						s += '0';
					}
					port = s + port
					if (this.oneport != 'ff' && this.oneport != 'FF') {
						this.portnum = port
					} else {
						this.portnum = 'ff'
					}
					this.infoshow();
				}

				this.from = this.option.from
			},

			// 根据设备号查询信息
			infoshow() {
				let data = {
					device: this.option.device,
					port: this.oneport,
					cmd: this.option.cmd
				}
				this.$base.request('charge/info', 'GET', data)
					.then(res => {
						if (res.data.code == 200) {
							this.user_phone = uni.getStorageSync('user').phone;
							console.log('会员手机号：'+this.user_phone);
							//this.initWebSocket() //开启原始版
							//this.initSocket()
							if (res.data.data.userProjectId && res.data.data.userProjectId != '0') {
								var user = uni.getStorageSync('user')
								user.projectId = res.data.data.userProjectId
								user.projectName = res.data.data.projectName
								uni.setStorageSync('user', user)
							}
							if (res.data.data.deviceId) {
								this.deviceId = res.data.data.deviceId
							}
							if (!res.data.data.defaultSafe) {
								this.checked = false
								this.bxname = '立即充电'
							} else {
								if (this.occas == 0) {
									this.checked = true
									this.bxname = '充电守护'
								} else {
									this.checked = false
									this.bxname = '立即充电'
								}

							}
							this.isVIP = res.data.data.isVIP
							this.longCharge = res.data.data.longCharge
							this.infolist = res.data.data

							this.areaId = res.data.data.areaId
							this.projectId = res.data.data.projectId
							console.log('projectId='+res.data.data.projectId);
							this.guanggao();
							
							this.shebeino = res.data.data.code
							if (this.infolist.safeMoney && this.infolist.transfer == 1) {
								var data = {
									amount: 0,
									safeMoney: this.infolist.safeMoney,
									checkType: 0
								}
								this.$base.request('charge/check/safe', 'GET', data)
									.then(res => {
										if (res.data.code == 200) {
											if (res.data.data == 1) {
												this.occas = 1
											} else {
												this.occas = 0
											}

										}
									})
									.catch(err => {

									})
							}
							if (res.data.data.wechatImg) {
								this.erimg = Config.imgapi + res.data.data.wechatImg
							}

							let data1 = {
								areaId: res.data.data.areaId,
								projectId: res.data.data.projectId,
							}
							//查费率
							this.$base.request('charge/rate', 'GET', data1)
								.then(res => {
									if (res.data.code == 200) {
										this.lbbtn();
										this.isFund = res.data.data.isFund
										this.first = res.data.data.first
										this.tapclass1 = res.data.data.first
										this.second = res.data.data.second
										this.third = res.data.data.third
										this.fourth = res.data.data.fourth
										this.isSpan = res.data.data.isSpan
										this.monthlyList = res.data.data.monthlyList
										this.oftenList = res.data.data.oftenList
										this.temporaryList = res.data.data.temporaryList
										this.firstOne = res.data.data.firstOne
										this.tapclass2 = res.data.data.firstOne
										this.fourthOne = res.data.data.fourthOne
										this.secondOne = res.data.data.secondOne
										this.thirdOne = res.data.data.thirdOne
										this.disFirstOne = res.data.data.disFirstOne
										this.disFourthOne = res.data.data.disFourthOne
										this.disSecondOne = res.data.data.disSecondOne
										this.disThirdOne = res.data.data.disThirdOne
										this.temporaryDisFirst = res.data.data.temporaryDisFirst
										this.temporaryDisFourth = res.data.data.temporaryDisFourth
										this.temporaryDisSecond = res.data.data.temporaryDisSecond
										this.temporaryDisThird = res.data.data.temporaryDisThird
										this.oftenOccupyFree = res.data.data.oftenOccupyFree
										this.oftenOccupyMax = res.data.data.oftenOccupyMax
										this.oftenOccupyRate = res.data.data.oftenOccupyRate
										this.temporaryOccupyFree = res.data.data.temporaryOccupyFree
										this.temporaryOccupyMax = res.data.data.temporaryOccupyMax
										this.temporaryOccupyRate = res.data.data.temporaryOccupyRate
										this.monthlyOccupyFree = res.data.data.monthlyOccupyFree
										this.monthlyOccupyMax = res.data.data.monthlyOccupyMax
										this.monthlyOccupyRate = res.data.data.monthlyOccupyRate
										if (res.data.data.isAutoStopOne) {
											this.isAutoStopOne = res.data.data.isAutoStopOne //一元模式是否充满自停
										}
										if (res.data.data.temporaryIsAutoStop) {
											this.temporaryIsAutoStop = res.data.data.temporaryIsAutoStop //临充是否充满自停
										}
										this.projectServiceDetailList = res.data.data.projectServiceDetailList
										this.endTimeStr = res.data.data.endTimeStr

										this.temporaryDefaultAutoStop = res.data.data.temporaryDefaultAutoStop
										this.lscmchecked = !!res.data.data.temporaryDefaultAutoStop
										if (this.endTimeStr) {
											this.xzchecked = '1'
										}
										if (res.data.data.oftenList.length > 0) {
											this.mtype = res.data.data.oftenList[0].types
											this.onetype = res.data.data.oftenList[0].typesStr == '' ?  (res.data.data.oftenList[0].types == 'B6' ? '价费分离': '') : res.data.data.oftenList[0].typesStr
											this.fwnum = res.data.data.oftenList[0].num / 100
											this.flremarks1 = res.data.data.oftenRemarks
											this.oftenMinMoney = res.data.data.oftenMinMoney
											this.fuwumoney = res.data.data.oftenList[0].num / 100
											this.powerRate = res.data.data.powerRate 
										}
										if (res.data.data.temporaryList.length > 0) {
											this.twotype = res.data.data.temporaryList[0].typesStr
											this.flremarks2 = res.data.data.temporaryRemarks
											this.temporaryMinMoney = res.data.data.temporaryMinMoney
											if (res.data.data.oftenList.length == 0 && res.data.data.monthlyList
												.length == 0) {
												this.tapbtn(2)
											}
										}
										if (res.data.data.monthlyList.length > 0) {
											this.bytype = res.data.data.monthlyList[0].types
											this.threetype = res.data.data.monthlyList[0].typesStr

											this.flremarks3 = res.data.data.monthlyRemarks
										}
										this.minMoney = res.data.data.minMoney
										if (this.monthlyList.length > 0) {
											this.showclass = 3
											if (this.longCharge == 1) {
												this.longcheck = false
												this.longshow = true
											}
										} else if (this.oftenList.length > 0) {
											this.showclass = 1
											if (this.longCharge == 1 && this.mtype != 'B4') {
												this.longcheck = false
												this.longshow = true
											}
										} else if (this.temporaryList.length > 0) {
											this.showclass = 2
										}
										if (this.infolist.defaultSafe == 1 && this.occas == 0) {
											this.checked = true
										} else {
											this.checked = false
										}

										if (this.monthlyList.length == 0 && this.oftenList.length == 0 && this
											.temporaryList.length > 0) {
											Dialog.confirm({
												title: '提示',
												message: '临时模式暂无法使用，请联系运营商',
											}).then(() => {
												this.back()
											}).catch(() => {
												return
												// on cancel
											});
										}

									} else {
										this.show = true
										this.tanshow = 4
										this.fourmsg = res.data.msg
										return
									}
								})
								.catch(err => {

								})
							if (process.env.NODE_ENV !== 'development') {
								if (res.data.data.isHas == 0 && this.yc == 0) {
									this.getMyLocation()
								}
							}
						} else if (res.data.code == 201) {
							this.show = true
							this.tanshow = 3

							this.nearid = res.data.data.projectId

						} else if (res.data.code == 701) {
							this.show = true
							this.tanshow = 2

							var item = res.data.data
							let data = {
								areaId: item.areaId,
								projectId: item.projectId,
								deviceId: this.option.device,
								port: this.oneport,
							}
							this.yzdata = data

						} else if (res.data.code == 801) {

							// this.ws.close()
							// this.ws = null
							uni.redirectTo({
								url: '../personal_data/personal_data?device=' + this.option.device + '&port=' +
									this.oneport + '&zt=' + 0 +
									'&from=' + this.from + '&cmd=' + this.option.cmd
							});

						} else if (res.data.code == 901) {
							this.oneshow = true
							var data = {
								fromType: this.option.from,
								deviceId: this.option.device
							}
							this.$base.request('charge/ports', 'GET', data)
								.then(res => {
									if (res.data.code == 200) {
										this.onelist = res.data.data.ports
										this.sixnum = res.data.data.device
									} else {
										this.$toast.fail('端口异常，请稍后再试！')
										this.back();
									}
								})
								.catch(err => {

								})
						} else {
							this.show = true
							this.tanshow = 4
							this.fourmsg = res.data.msg
						}
					})
					.catch(err => {

					})

			},
			//开始上电
			cdbtn(vul) {
				let that = this;
				if (clickThrottle(1100)) {
					if (that.xychecked == false && (that.xieyidata != {} && that.xieyidata.display == 1)) {
						Dialog.confirm({
							title: '提示',
							message: '请阅读并勾选《' + that.xieyidata.agreementName + '》',
							confirmButtonText: '同意并勾选'
						}).then(() => {
							that.xychecked = true
							that.cdbtn(vul);
						}).catch(() => {
							return
							// on cancel
						});
					} else {
						var isBF = uni.getStorageSync('user').isBF
						if (isBF == 1 && that.showclass == 2 && (that.bhdk == 'ff' || that.bhdk == 'FF')) {
							if (that.dgnum != 9) {
								that.xuanbtn = vul
								that.oneshow = true
							} else {
								if (that.option.cmd == 1) {
									that.xuanbtn = vul
									that.oneshow = true
								}
							}
							var data = {
								fromType: that.option.from,
								deviceId: that.option.device
							}

							that.$base.request('charge/ports', 'GET', data)
								.then(res => {
									if (res.data.code == 200) {
										that.onelist = res.data.data.ports
										that.sixnum = res.data.data.device
									} else {
										that.$toast.fail('端口异常，请稍后再试！')
										that.back();
									}
								})
								.catch(err => {

								})
						} else {
							if (that.infolist.transfer == 1) {
								if (that.infolist.displayButton == 0) {
									if (that.checked == true) {
										that.tapcdb()
									} else {
										if (that.infolist.twoWarn == 0) {
											that.isSafe = 0
											that.cdbtnson()
										} else {
											if (that.occas == 0) {
												that.seluser()
												that.warnshow = true
											} else {
												that.isSafe = 0
												that.cdbtnson()
											}

										}

									}
								} else if (that.infolist.displayButton == 1) {
									if (vul == 1) {
										that.tapcdb()
									} else {
										if (that.infolist.twoWarn == 0) {
											that.isSafe = 0
											that.cdbtnson()
										} else {
											if (that.occas == 0) {
												that.seluser()
												that.warnshow = true
											} else {
												that.isSafe = 0
												that.cdbtnson()
											}

										}
									}
								}
							} else if (that.infolist.transfer == 0) {
								that.isSafe = 0
								that.cdbtnson()
							}
						}
					}
				} else {
					that.$toast.fail('请勿重复点击')
					return
				}

			},

			tapcdb() {
				if (this.showclass == 2) {
					this.isSafe = 1
					this.cdbtnson()
				} else {
					let amount = 0
					if (this.showclass == 1) {
						this.chargeType = this.oftenList[0].types
					} else if (this.showclass == 2) {
						this.chargeType = this.temporaryList[0].types
					} else if (this.showclass == 3) {
						this.chargeType = this.monthlyList[0].types
					}
					if (this.showclass == 1 && this.chargeType == 'B4') {
						if (this.tapclass2 == 'a') {
							if ((!(/(^[1-9]\d*$)/.test(Number(this.handm))) && Number(this.handm)) || !Number(this
									.handm)) {
								this.$toast.fail('请输入整数金额')
								return
							}
							if (Number(this.handm) && (Number(this.handm) > 20 || Number(this.handm) < 1)) {
								this.$toast.fail('请输入1至20之间的金额(包含20)')
								return
							}
							amount = Number(this.handm)

						} else {
							amount = this.tapclass2
						}
					} else {
						amount = 0
					}
					var data = {
						amount: amount,
						safeMoney: this.infolist.safeMoney,
						checkType: 1
					}
					this.$base.request('charge/check/safe', 'GET', data)
						.then(res => {
							if (res.data.code == 200) {
								if (res.data.data == 1) {
									Dialog.confirm({
										title: '提示',
										message: '您已选择“无忧充电”服务，当前基本账户余额不足，是否现在去充值？\n提示：您如果不想购买“无忧充电”服务，可以取消后再进行充电操作。',
										messageAlign: 'left'
									}).then(() => {
										uni.navigateTo({
											url: '../account_recharge/account_recharge?powerontype=' +
												1
										});
									}).catch(() => {
										// on cancel
									});
								} else {
									this.isSafe = 1
									this.cdbtnson()
								}

							} else {
								this.$toast.fail(res.data.msg)
								return

							}
						})
						.catch(err => {

						})

				}
			},
			//关闭费率弹窗
			paymentclose() {
				this.payment_type = false
			},
			//打开费率弹窗
			paymentopen() {
				this.payment_type = true
			},
			cdbtnson() {
				var endTime = uni.getStorageSync('user').endTime
				// this.initWebSocket()
				if (this.showclass != 3 && endTime != null && this.monthlyList.length > 0) {
					Dialog.confirm({
						title: '提示',
						message: '系统检测到您已购买包月套餐,使用“常用或临时模式”会产生扣费，是否确认'
					}).then(() => {
						if (this.showclass == 2) {
							Dialog.confirm({
								title: '提示',
								message: '您选择的是“临时充电”模式，如果上电不成功，系统会在30分钟内自动退款，确认充电吗？'
							}).then(() => {
								setTimeout(() => {
									this.lsshow()
								}, 500)
							}).catch(() => {
								// on cancel
							});

						} else {
							if (this.showclass == 3) {
								this.$base.request('charge/check', 'GET')
									.then(res => {
										if (res.data.code == 200) {
											if (res.data.data.isAlert == 1) {
												this.gbshow = true
											} else {
												setTimeout(() => {
													this.cyshow()
												}, 500)
											}
										}
									})
									.catch(err => {

									})
							} else {
								setTimeout(() => {
									this.cyshow()
								}, 500)
							}

						}
					}).catch(() => {
						setTimeout(() => {
							this.showclass = 3
						}, 500)

					});
				} else {
					if (this.showclass == 2) {
						Dialog.confirm({
							title: '提示',
							message: '您选择的是“临时充电”模式，如果上电不成功，系统会在30分钟内自动退款，确认充电吗？'
						}).then(() => {
							setTimeout(() => {
								this.paymentopen()
							}, 500)
						}).catch(() => {
							// on cancel
						});

					} else {
						if (this.showclass == 3) {
							this.$base.request('charge/check', 'GET')
								.then(res => {
									if (res.data.code == 200) {
										if (res.data.data.isAlert == 1) {
											this.gbshow = true
										} else {
											setTimeout(() => {
												this.cyshow()
											}, 500)
										}
									}
								})
								.catch(err => {

								})
						} else {
							setTimeout(() => {
								this.cyshow()
							}, 500)
						}
					}
				}
			},
			//临时充电调用接口
			lsshow() {
				let lscm = 0
				if (this.lscmchecked == false) {
					lscm = 0
				} else {
					lscm = 1
				}
				let data = {
					areaId: this.areaId,
					devicePort: this.deviceId + this.oneport,
					pear: this.tapclass1,
					projectid: this.projectId,
					safe: this.isSafe,
					isAutoStop: lscm,
					defaultAutoStop: 0,
					pt: 2, //2=小程序支付标识，公众号=1,6=银联
				}
				if(this.current == 6){
					data.pt = 6;
				}
				uni.showLoading({
					title: '请稍候',
					mask: true
				})

				let _this = this
				_this.$base.request('order/temsave', 'POST', data)
					.then(res => {
						console.log(res);
						if (res.data.code == 200) {
							let arr = res.data.data
							if(data.pt == 6){
								console.log(arr);
								_this.merOrderId = arr.merOrderId;
								uni.navigateToMiniProgram({
									appId: arr.cqpMpAppId,
									path:arr.cqpMpPath,
									extraData:{
										merOrderId: arr.merOrderId
									},
									success(miniRes) {
										uni.hideLoading();
										_this.payment_type = false;
									},
									fail() {
										uni.hideLoading();
										_this.payment_type = false;
									}
								})
							}
							else{
								uni.requestPayment({
									provider: 'wxpay',
									timeStamp: arr.timeStamp,
									nonceStr: arr.nonceStr,
									package: arr.wpackage,
									signType: arr.signType,
									paySign: arr.paySign,
									success: function(e) {
										console.log(e);
										if (e.errMsg === 'requestPayment:ok') {
											_this.timeId = setTimeout(() => { //20秒之后没推过来关闭 弹窗
												uni.hideLoading();
												_this.payment_type = false;
												_this.timeshow = true
											}, 20000);
										} else {
											uni.hideLoading();
											_this.payment_type = false;
										}
									},
									fail: function(err) {
										console.log('fail:' + JSON.stringify(err));
										uni.hideLoading();
										_this.payment_type = false;
										if (err.errMsg == 'requestPayment:fail cancel') {
											_this.$toast.fail('已取消支付');
										}
								
									}
								});
							}
							
						} else {
							_this.$toast.fail(res.data.msg)
						}

					})
					.catch(err => {
						_this.$base.prompt('提示', '开始充电接口无响应', () => {}, () => {})
						uni.hideLoading()
					})
			},
			//常用充电调用接口
			cyshow() {
				let chang = 0
				if (this.longcheck == false) {
					chang = 0
				} else {
					chang = 1
				}
				if (this.mtype != 'B4' && this.showclass == 1) {
					if (this.tapclass == 6) {
						//tapclass == 6为自定义时间
						if ((!(/(^[1-9]\d*$)/.test(Number(this.handshu))) && Number(this.handshu)) || !Number(this
								.handshu)) {
							this.$toast.fail('请输入整数时长')
							return
						}
						if (this.handshu) {
							if (Number(this.handshu) > 18 || Number(this.handshu) < 1) {
								this.$toast.fail('充电时长应在1-18小时之内')
								return
							}
						}
					}

					if (this.tapclass == 1) {
						this.time = 0
					} else if (this.tapclass == 2) {
						this.time = 14400
					} else if (this.tapclass == 3) {
						this.time = 21600
					} else if (this.tapclass == 4) {
						this.time = 28800
					} else if (this.tapclass == 5) {
						this.time = 36000
					} else if (this.tapclass == 6) {
						this.time = 3600 * Number(this.handshu)
					}
				}

				if (this.showclass == 1) {
					this.chargeType = this.oftenList[0].types
				} else if (this.showclass == 2) {
					this.chargeType = this.temporaryList[0].types
				} else if (this.showclass == 3) {
					this.chargeType = this.monthlyList[0].types
				} else if (this.showclass == 4) {
					this.chargeType = this.isVIP
				}
				let span = ''
				if (this.isSpan == false) {
					span = 1
				} else if (this.isSpan == true) {
					span = 2
				}
				if (this.chargeType == 'B2') {
					if (this.xzchecked == '1') {
						this.serviceType = 1
					} else if (this.xzchecked == '2') {
						this.serviceType = 0
					}
				} else {
					this.serviceType = ''
				}
				let data = {}
				if (this.mtype == 'B4' && this.showclass == 1) {
					let onec = 0
					if (this.onecmchecked == false) {
						onec = 0
					} else {
						onec = 1
					}
					if (this.tapclass2 == 'a') {
						if ((!(/(^[1-9]\d*$)/.test(Number(this.handm))) && Number(this.handm)) || !Number(this.handm)) {
							this.$toast.fail('请输入整数金额')
							return
						}
						if (Number(this.handm) && (Number(this.handm) > 20 || Number(this.handm) < 1)) {
							this.$toast.fail('请输入1至20之间的金额(包含20)')
							return
						}
						data = {
							time: 0,
							device: this.option.device,
							cmd: this.option.cmd,
							chargeType: this.chargeType,
							isSpan: span,
							port: this.oneport,
							amount: Number(this.handm),
							isSafe: this.isSafe,
							isAutoStop: onec,
							defaultAutoStop: 0,
							longCharge: chang,
							serviceType: this.serviceType
						}
					} else {
						data = {
							time: 0,
							device: this.option.device,
							cmd: this.option.cmd,
							chargeType: this.chargeType,
							isSpan: span,
							port: this.oneport,
							amount: this.tapclass2,
							isSafe: this.isSafe,
							isAutoStop: onec,
							defaultAutoStop: 0,
							longCharge: chang,
							serviceType: this.serviceType
						}
					}

				} else {
					data = {
						time: this.time,
						device: this.option.device,
						cmd: this.option.cmd,
						chargeType: this.chargeType,
						isSpan: span,
						port: this.oneport,
						isSafe: this.isSafe,
						isAutoStop: 0,
						defaultAutoStop: 0,
						longCharge: chang,
						serviceType: this.serviceType
					}
				}
				uni.showLoading({
					title: '请稍候',
					mask: true
				})
				this.timeId = setTimeout(() => { //20秒之后没推过来关闭 弹窗
					uni.hideLoading()
					this.$base.prompt('温馨提示', '因网络原因，您此次充电可能不成功，如已开始充电，请留意随后的微信消息提示，如未开始充电，请重试一次', () => {
						this.back();
					}, () => {
						this.back();
					})
				}, 20000);
				this.$base.request('charge/start', 'GET', data)
					.then(res => {
						if (res.data.msg == '不允许重复提交，请稍后再试') {
							clearTimeout(this.timeId)
							uni.hideLoading()
							this.$toast.fail('系统繁忙，请稍后再试')
						}
						// this.initWebSocket()
					})
					.catch(err => {

						this.$base.prompt('提示', '开始充电接口无响应', () => {}, () => {})
						uni.hideLoading()
					})
			},
			//获取定位信息
			getMyLocation() {
				let _this = this;
				let data = {
					url: location.href.split('#')[0],
					appid: uni.getStorageSync('user').appid
				}
				uni.showLoading({
					title: '加载中...'
				})
				_this.$base.request('configs', 'GET', data)
					.then(res => {
						if (res.data.code == '200') {
							uni.hideLoading()
							var timestamp = res.data.data.timestamp;;
							var noncestr = res.data.data.noncestr;
							var signature = res.data.data.signature;
							var appId = res.data.data.appid;
							wx.config({
								debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
								//debug : true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
								appId: appId, // 必填，公众号的唯一标识
								timestamp: timestamp, // 必填，生成签名的时间戳
								nonceStr: noncestr, // 必填，生成签名的随机串
								signature: signature, // 必填，签名，见附录1
								jsApiList: ['getLocation', 'openLocation'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
							});

							wx.ready(function() {
								wx.getLocation({
									type: "wgs84",
									success: function(res) {

										var longitude = ''; //百度经度
										var latitude = ''; //百度纬度
										var convertor = new BMap.Convertor();
										var ggPoint = new BMap.Point(res.longitude, res.latitude);
										var pointArr = [];
										pointArr.push(ggPoint);
										convertor.translate(pointArr, 1, 5, function(data) {
											if (data.status === 0) {
												longitude = data.points[0].lng;
												latitude = data.points[0].lat;

												_this.showMap(latitude, longitude)
											}
										});

									},
									cancel: function(res) {

									},
									fail: function(res) {
										if (uni.getSystemInfoSync().platform == 'ios') {
											_this.$toast.fail('获取位置信息失败请检查是否开启手机定位')
										}
									}
								});
							});
						} else {
							_this.$toast.fail(res.data.msg)
							return
						}

					})
					.catch(err => {

					})
			},
			//包月套餐提示
			byque() {
				this.cyshow();
				this.gbshow = false
			},
			bycolose() {
				this.gbshow = false
			},
			bygo() {
				var type = '1'
				var tapshow = '3'
				setTimeout(() => {
					uni.navigateTo({
						url: '../account_recharge/account_recharge?type=' + type + '&tapshow=' + tapshow +
							'&areaId=' + this.areaId + '&upshow=' + 1
					});
				}, 1200)
			},
			// buyby() {
			// 	var type = '1'
			// 	var tapshow = '3'

			// 	uni.navigateTo({
			// 		url: '../account_recharge/account_recharge?type=' + type + '&tapshow=' + tapshow + '&areaId=' +
			// 			this.areaId
			// 	});

			// },
			timebtn() {
				this.back();
			},
			showMap(latitude, longitude) {
				let data = {
					deviceId: this.deviceId,
					latitude: latitude,
					longitude: longitude
				}

				this.$base.request('nearby/location', 'PUT', data)
					.then(res => {

					})
					.catch(err => {

					})
			},
			//选择端口调用接口
			montbtn(vul) {
				this.mshow = vul
				if (vul == 0) {
					this.dknum = '00'
				} else if (vul = 1) {
					this.dknum = '01'
				}

			},
			//选择端口调用接口
			montbtn1(vul, status) {
				if (status == '空闲' || status == '') {
					if (vul < 9) {
						this.oneport = '0' + String(vul)
						this.portnum = '0' + String(Number(vul) + 1)
					} else {
						this.oneport = String(vul)
						this.portnum = String(Number(vul) + 1)
					}
					this.oneshow = false
					this.bhdk = this.oneport
					var isBF = uni.getStorageSync('user').isBF
					if (isBF == 1 && this.showclass == 2) {
						this.cdbtn(this.xuanbtn)
					} else {
						this.infoshow();
					}
				} else if (status == '禁用') {
					this.$toast.fail('该端口已被禁用，请选择其他空闲端口')
					return
				} else if (status == '绑定') {
					this.$toast.fail('该端口已被绑定，请选择其他空闲端口')
					return
				} else {
					this.$toast.fail('该端口已被占用，请选择其他空闲端口')
					return
				}


			},
			pad(num, n) {
				var len = num.toString().length;
				while (len < n) {
					num = "0" + num;
					len++;
				}
				return num;
			},
			dkshowbtn() {
				let chang = 0
				if (this.longcheck == false) {
					chang = 0
				} else {
					chang = 1
				}
				this.duanshow = false
				if (this.tapclass == 1) {
					this.time = 0
				} else if (this.tapclass == 2) {
					this.time = 14400
				} else if (this.tapclass == 3) {
					this.time = 21600
				} else if (this.tapclass == 4) {
					this.time = 28800
				} else if (this.tapclass == 5) {
					this.time = 36000
				} else if (this.tapclass == 6) {
					this.time = 3600 * this.handshu
				}
				if (this.showclass == 1) {
					this.chargeType = this.oftenList[0].types
				} else if (this.showclass == 2) {
					this.chargeType = this.temporaryList[0].types
				} else if (this.showclass == 3) {
					this.chargeType = this.monthlyList[0].types
				}
				let span = ''
				if (this.isSpan == false) {
					span = 1
				} else if (this.isSpan == true) {
					span = 2
				}
				if (this.chargeType == 'B2') {
					if (this.xzchecked == '1') {
						this.serviceType = 1
					} else if (this.xzchecked == '2') {
						this.serviceType = 0
					}
				} else {
					this.serviceType = ''
				}
				let data = {}
				if (this.mtype == 'B4' && this.showclass == 1) {
					let onec = 0
					if (this.onecmchecked == false) {
						onec = 0
					} else {
						onec = 1
					}
					if (this.tapclass2 == 'a') {
						if ((!(/(^[1-9]\d*$)/.test(Number(this.handm))) && Number(this.handm)) || !Number(this.handm)) {
							this.$toast.fail('请输入整数金额')
							return
						}
						if (Number(this.handm) && (Number(this.handm) > 20 || Number(this.handm) < 1)) {
							this.$toast.fail('请输入1至20之间的金额(包含20)')
							return
						}
						data = {
							time: 0,
							device: this.option.device,
							cmd: this.option.cmd,
							chargeType: this.chargeType,
							isSpan: span,
							port: this.dknum,
							amount: Number(this.handm),
							isSafe: this.isSafe,
							isAutoStop: onec,
							defaultAutoStop: 0,
							longCharge: chang,
							serviceType: this.serviceType
						}
					} else {
						data = {
							time: 0,
							device: this.option.device,
							cmd: this.option.cmd,
							chargeType: this.chargeType,
							isSpan: span,
							port: this.dknum,
							amount: this.tapclass2,
							isSafe: this.isSafe,
							isAutoStop: onec,
							defaultAutoStop: 0,
							longCharge: chang,
							serviceType: this.serviceType
						}
					}

				} else if (this.showclass == 2) {
					let lscm = 0
					if (this.lscmchecked == false) {
						lscm = 0
					} else {
						lscm = 1
					}
					data = {
						time: 0,
						device: this.option.device,
						cmd: this.option.cmd,
						chargeType: this.chargeType,
						isSpan: span,
						port: this.dknum,
						amount: this.amount,
						userId: this.userId,
						isSafe: this.isSafe,
						rechargeNo: this.rechargeNo,
						isAutoStop: lscm,
						defaultAutoStop: 0,
						longCharge: chang,
						serviceType: this.serviceType
					}
				} else {
					data = {
						time: this.time,
						device: this.option.device,
						cmd: this.option.cmd,
						chargeType: this.chargeType,
						isSpan: span,
						port: this.dknum,
						userId: this.userId,
						rechargeNo: this.rechargeNo,
						isSafe: this.isSafe,
						isAutoStop: 0,
						defaultAutoStop: 0,
						longCharge: chang,
						serviceType: this.serviceType
					}
				}

				uni.showLoading({
					title: '请稍候',
					mask: true
				})
				this.timeId = setTimeout(() => { //20秒之后没推过来关闭 弹窗
					uni.hideLoading()
					clearTimeout(this.refundId)
					this.$base.prompt('温馨提示', '因网络原因，您此次充电可能不成功，如已开始充电，请留意随后的微信消息提示，如未开始充电，请重试一次', () => {
						this.back();
					}, () => {
						this.back();
					})
				}, 20000);
				this.$base.request('charge/start', 'GET', data)
					.then(res => {
						if (res.data.msg == '不允许重复提交，请稍后再试') {
							clearTimeout(this.timeId)
							uni.hideLoading()
							this.$toast.fail('系统繁忙，请稍后再试')
						}
						// this.initWebSocket()
						// this.duanshow = false
					})
					.catch(err => {
						this.$base.prompt('提示', '开始充电接口无响应', () => {}, () => {})
						uni.hideLoading()
					})
			},

			// 初始化websocket连接
			initSocket() {
				let wsuri = Config.wx1 + uni.getStorageSync('userId');
				this.socketTask = uni.connectSocket({
					url: wsuri,
					success(data) {
						console.log("websocket连接成功："+wsuri);
					},
				})
				this.socketTask.onOpen((res) => {
					console.log('websocket链接开启')
					this.webIsTrue = true
				})
				// 注：只有连接正常打开中 ，才能正常收到消息
				this.socketTask.onMessage((res) => {
					console.log('websocket链接数据返回信息', res)
					let res0 = JSON.parse(res.data)
					clearTimeout(this.timeId)
					clearTimeout(this.refundId)
					if (res0.code == 200) { //充电成功
						// if(uni.getStorageSync('user').poster==1){
						// 	this.guanggao1()
						// }
						uni.hideLoading()
						this.$toast.success('充电成功')
						setTimeout(() => {
							if(this.burl!=0){
								// 跳转充电中页面 
								uni.navigateTo({
									url: `../chargingzhong_detail/chargingzhong_detail?codetype=0&id=${res0.id}&url=${this.burl}`
								});
								this.ontime=0
							}else{
								uni.navigateTo({
									url: `../chargingzhong_detail/chargingzhong_detail?codetype=0&id=${res0.id}`
								});
								this.ontime=0
							}
						}, 1200)
					} else if (res0.code == '0D' || res0.code == '05' || res0.code == '07') {
						uni.hideLoading()
						this.$toast.fail(res0.msg)
						var type = '1'
						var tapshow = '3'
						setTimeout(() => {
							uni.navigateTo({
								url: '../account_recharge/account_recharge?type=' + type +
									'&tapshow=' + tapshow + '&areaId=' + this.areaId+'&upshow='+1
							});
						}, 1200)
					} else if (res0.code == '101') {
						this.duanshow = true
						uni.hideLoading()
						this.refundId=setTimeout(() => {
							this.duanshow = false
							let data = {
								ornum: this.ornum
							}
							uni.showLoading({
								title: '请稍候',
								mask: true
							})
							this.$base.request('refund/refund', 'POST', data)
								.then(res1 => {
									if (res1.data.code == 200) {
										uni.hideLoading()
										this.$toast.success('退款成功')
										this.back()
									} else {
										this.$toast.fail(res1.data.msg)
										this.back()
									}
								})
								.catch(err => {
						
								})
						}, 100000)
						if (res0.userId) {
							this.userId = res0.userId
						}
						if (res0.amount) {
							this.amount = res0.amount
						}
						if (res0.rechargeNo) {
							this.rechargeNo = res0.rechargeNo
							this.ornum = res0.rechargeNo
						}
					
					
					
					} else if (res0.code == '06') { //余额不足
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message: res0.msg
						}).then(() => {
							uni.navigateTo({
								url: '../account_recharge/account_recharge?powerontype=' + 1
							});
						}).catch(() => {
							// on cancel
						});
					} else if(res0.code == '0C'){
						var phone=uni.getStorageSync('user').projectPhone
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message:'您当前属于跨区充电，资金池余额不足，请点击确认联系您绑定的小区运营商'
						}).then(() => {
							uni.makePhoneCall({
								phoneNumber: phone
							});
						}).catch(() => {
							// on cancel
						});
					}else if(res0.code == '0G'){
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message:res0.msg
						}).then(() => {
							this.fwtan=true
						});
					}else if(res0.code == '0H'){
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message:res0.msg
						}).then(() => {
							this.xzchecked='2'
						});
					}else {
						uni.hideLoading()
						this.$toast.fail(res0.msg)
						// this.ws.close()
						// this.ws = null
					}
				});

				this.socketTask.onClose((e) => {
					// 关闭 websocket
					console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean)
					this.webIsTrue = false
					if (this.ws != null) {
						this.initSocket()
					}
				})
				this.socketTask.onerror = (e) => {
					console.log(e, 'WebSocket发生错误')
				}
			},
			
			// createSocket() {
			// 	let that = this;
			// 	if (that.webIsTrue) {
			// 		console.log('WebSocket 开始初始化')
			// 		// 监听 WebSocket 连接打开事件
			// 		try {
			// 			uni.onSocketOpen(() => {
			// 				console.log('WebSocket 连接成功')
			// 			})
			// 			// 监听 WebSocket 接受到服务器的消息事件
			// 			uni.onSocketMessage((res) => {
			// 				console.log('websocket链接数据返回信息', res)
			// 				let res0 = JSON.parse(res.data)
			// 				clearTimeout(that.timeId)
			// 				clearTimeout(that.refundId)
			// 				if (res0.code == 200) { //充电成功
			// 					if (uni.getStorageSync('user').poster == 1) {
			// 						that.guanggao1()
			// 					}
			// 					uni.hideLoading()
			// 					that.$toast.success('充电成功')
			// 					setTimeout(() => {
			// 						if (that.burl != 0) {
			// 							// 跳转充电中页面 
			// 							uni.navigateTo({
			// 								url: `../chargingzhong_detail/chargingzhong_detail?codetype=0&id=${res0.id}&url=${that.burl}`
			// 							});
			// 							that.ontime = 0
			// 						} else {
			// 							that.back()
			// 						}
			// 					}, 1200)
			// 				} else if (res0.code == '0D' || res0.code == '05' || res0.code == '07') {
			// 					that.$toast.fail(res0.msg)
			// 					var type = '1'
			// 					var tapshow = '3'
			// 					setTimeout(() => {
			// 						uni.navigateTo({
			// 							url: '../account_recharge/account_recharge?type=' + type +
			// 								'&tapshow=' + tapshow + '&areaId=' + that.areaId +
			// 								'&upshow=' + 1
			// 						});
			// 					}, 1200)
			// 				} else if (res0.code == '101') {
			// 					that.duanshow = true
			// 					uni.hideLoading()
			// 					that.refundId = setTimeout(() => {
			// 						that.duanshow = false
			// 						let data = {
			// 							ornum: that.ornum
			// 						}
			// 						uni.showLoading({
			// 							title: '请稍候',
			// 							mask: true
			// 						})
			// 						that.$base.request('refund/refund', 'POST', data)
			// 							.then(res1 => {
			// 								if (res1.data.code == 200) {
			// 									uni.hideLoading()
			// 									that.$toast.success('退款成功')
			// 									that.back()
			// 								} else {
			// 									that.$toast.fail(res1.data.msg)
			// 									that.back()
			// 								}
			// 							})
			// 							.catch(err => {

			// 							})
			// 					}, 100000)
			// 					if (res0.userId) {
			// 						that.userId = res0.userId
			// 					}
			// 					if (res0.amount) {
			// 						that.amount = res0.amount
			// 					}
			// 					if (res0.rechargeNo) {
			// 						that.rechargeNo = res0.rechargeNo
			// 						that.ornum = res0.rechargeNo
			// 					}
			// 				} else if (res0.code == '06') { //余额不足
			// 					uni.hideLoading()
			// 					Dialog.confirm({
			// 						title: '提示',
			// 						message: res0.msg
			// 					}).then(() => {
			// 						uni.navigateTo({
			// 							url: '../account_recharge/account_recharge?powerontype=' +
			// 								1
			// 						});
			// 					}).catch(() => {
			// 						// on cancel
			// 					});
			// 				} else if (res0.code == '0C') {
			// 					var phone = uni.getStorageSync('user').projectPhone
			// 					Dialog.confirm({
			// 						title: '提示',
			// 						message: '您当前属于跨区充电，资金池余额不足，请点击确认联系您绑定的小区运营商'
			// 					}).then(() => {
			// 						uni.makePhoneCall({
			// 							phoneNumber: phone
			// 						});
			// 					}).catch(() => {
			// 						// on cancel
			// 					});
			// 				} else if (res0.code == '0G') {
			// 					uni.hideLoading()
			// 					Dialog.confirm({
			// 						title: '提示',
			// 						message: res0.msg
			// 					}).then(() => {
			// 						that.fwtan = true
			// 					});
			// 				} else if (res0.code == '0H') {
			// 					uni.hideLoading()
			// 					Dialog.confirm({
			// 						title: '提示',
			// 						message: res0.msg
			// 					}).then(() => {
			// 						that.xzchecked = '2'
			// 					});
			// 				} else {
			// 					uni.hideLoading()
			// 					that.$toast.fail(res0.msg)
			// 				}
			// 			})
			// 			// 监听 WebSocket 连接关闭事件
			// 			uni.onSocketClose(() => {
			// 				console.log('WebSocket 关闭了')
			// 			})
			// 			// 监听 WebSocket 错误事件
			// 			uni.onSocketError((res) => {
			// 				console.log('WebSocket 出错了')
			// 				console.log(res)
			// 			})
			// 		} catch (error) {
			// 			console.warn('发生了一个错误：', error.message);
			// 		}
			// 	} else {
			// 		console.warn('WebSocket 初始化失败!')
			// 	}
			// },
			
			//websocket  原始版
			initWebSocket() { //初始化weosocket
			
				// const wsuri = Config.wx + uni.getStorageSync('userId')
				let wsuri =''
				if(this.xcxtype==1){
					wsuri = Config.wx + uni.getStorageSync('userId')
				}else{
					wsuri = Config.wx1 + uni.getStorageSync('userId')
				}
				this.ws = new WebSocket(wsuri)
				console.log(this.ws, '66')
				// 监听开启websocket开启 并发送数据
				this.ws.onopen = () => {
					console.log('websocket链接开启')
					this.webIsTrue = true
				};
				this.ws.onmessage = (res) => {
					console.log('websocket链接数据返回信息', res)
					let res0 = JSON.parse(res.data)
					clearTimeout(this.timeId)
					clearTimeout(this.refundId)
					if (res0.code == 200) { //充电成功
						if(uni.getStorageSync('user').poster==1){
							this.guanggao1()
						}
						uni.hideLoading()
						this.$toast.success('充电成功')
						setTimeout(() => {
							if(this.burl!=0){
								// 跳转充电中页面 
								uni.navigateTo({
									url: `../chargingzhong_detail/chargingzhong_detail?codetype=0&id=${res0.id}&url=${this.burl}`
								});
								this.ontime=0
							}else{
								uni.navigateTo({
									url: `../chargingzhong_detail/chargingzhong_detail?codetype=0&id=${res0.id}`
								});
								this.ontime=0
							}
						}, 1200)
					} else if (res0.code == '0D' || res0.code == '05' || res0.code == '07') {
						this.$toast.fail(res0.msg)
						var type = '1'
						var tapshow = '3'
						setTimeout(() => {
							uni.navigateTo({
								url: '../account_recharge/account_recharge?type=' + type +
									'&tapshow=' + tapshow + '&areaId=' + this.areaId+'&upshow='+1
							});
						}, 1200)
					} else if (res0.code == '101') {
						this.duanshow = true
						uni.hideLoading()
						this.refundId=setTimeout(() => {
							this.duanshow = false
							let data = {
								ornum: this.ornum
							}
							uni.showLoading({
								title: '请稍候',
								mask: true
							})
							this.$base.request('refund/refund', 'POST', data)
								.then(res1 => {
									if (res1.data.code == 200) {
										uni.hideLoading()
										this.$toast.success('退款成功')
										this.back()
									} else {
										this.$toast.fail(res1.data.msg)
										this.back()
									}
								})
								.catch(err => {
						
								})
						}, 100000)
						if (res0.userId) {
							this.userId = res0.userId
						}
						if (res0.amount) {
							this.amount = res0.amount
						}
						if (res0.rechargeNo) {
							this.rechargeNo = res0.rechargeNo
							this.ornum = res0.rechargeNo
						}
			
			
			
					} else if (res0.code == '06') { //余额不足
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message: res0.msg
						}).then(() => {
							uni.navigateTo({
								url: '../account_recharge/account_recharge?powerontype=' + 1
							});
						}).catch(() => {
							// on cancel
						});
					} else if(res0.code == '0C'){
						var phone=uni.getStorageSync('user').projectPhone
						Dialog.confirm({
							title: '提示',
							message:'您当前属于跨区充电，资金池余额不足，请点击确认联系您绑定的小区运营商'
						}).then(() => {
							uni.makePhoneCall({
								phoneNumber: phone
							});
						}).catch(() => {
							// on cancel
						});
					}else if(res0.code == '0G'){
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message:res0.msg
						}).then(() => {
							this.fwtan=true
						});
					}else if(res0.code == '0H'){
						uni.hideLoading()
						Dialog.confirm({
							title: '提示',
							message:res0.msg
						}).then(() => {
							this.xzchecked='2'
						});
					}else {
						uni.hideLoading()
						this.$toast.fail(res0.msg)
						// this.ws.close()
						// this.ws = null
					}
			
			
				};
			
				this.ws.onclose = (e) => {
					// 关闭 websocket
					console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean)
					this.webIsTrue = false
					if (this.ws != null) {
						this.initWebSocket()
					}
			
			
				};
				this.ws.onerror = (e) => {
					console.log(e, 'WebSocket发生错误')
				}
			
			},

			//模式选择按钮
			tapbtn(val) {
				this.showclass = val
				this.longcheck = false
				if (this.infolist.defaultSafe == 1 && this.occas == 0) {
					this.checked = true
				} else {
					this.checked = false
				}
				if (val == 2) {
					this.handbtn1(1)
					this.longshow = false
				} else if (val == 1) {
					if (this.longCharge == 1 && this.tapclass == 1 && this.mtype != 'B4') {
						this.longshow = true
					} else {
						this.longshow = false
					}
				} else if (val == 3) {
					if (this.longCharge == 1) {
						this.longshow = true
					} else {
						this.longshow = false
					}
				}

			},
			//小时选择按钮
			handbtn(val) {
				this.tapclass = val
				this.longcheck = false
				if (this.longCharge == 1 && this.tapclass == 1) {
					this.longshow = true
				} else {
					this.longshow = false
				}
			},
			//金额选择按钮
			handbtn2(val) {
				this.tapclass2 = val
			},
			onInput(e) {
				var reg = /.*\..*/;
				if (reg.test(e.detail.value)) {
					this.$toast.fail('请输入整数时长')
					return
				}
			},
			onInput1(e) {
				var num = e.detail.value
				// var reg = /.*\..*/;
				if (!(/(^[1-9]\d*$)/.test(num)) && num) {
					this.$toast.fail('请输入整数金额')
					this.dishandm = 0
					return
				}
				if (num && (num > 20 || num < 1)) {
					this.$toast.fail('请输入1至20之间的金额(包含20)')
					this.dishandm = 0
					return
				}

				function sortNumber(a, b) { //升序
					return a - b
				}


				var m = new Map();
				m.set(this.firstOne, this.disFirstOne)
				m.set(this.secondOne, this.disSecondOne)
				m.set(this.thirdOne, this.disThirdOne)
				m.set(this.fourthOne, this.disFourthOne)
				var arr1 = [this.firstOne, this.secondOne, this.thirdOne, this.fourthOne, Number(num)];
				arr1.sort(sortNumber);

				function unique1(arr) {
					var hash = [];
					for (var i = 0; i < arr.length; i++) {
						if (hash.indexOf(arr[i]) == -1) {
							hash.push(arr[i]);
						}
					}
					return hash;
				}
				arr1 = unique1(arr1)
				if (arr1.length == 4) {
					this.dishandm = m.get(Number(num))
				} else {
					var i = arr1.indexOf(Number(num))
					if (i == 0) {
						this.dishandm = 0
					} else {
						this.dishandm = m.get(arr1[i - 1])
					}

				}

			},
			//小时选择按钮2
			handbtn1(val) {
				if (val == 1) {
					this.hsmoney = this.first
					this.hsfl = this.temporaryDisFirst
				} else if (val == 2) {
					this.hsmoney = this.second
					this.hsfl = this.temporaryDisSecond
				} else if (val == 3) {
					this.hsmoney = this.third
					this.hsfl = this.temporaryDisThird
				} else if (val == 4) {
					this.hsmoney = this.fourth
					this.hsfl = this.temporaryDisFourth
				}
				this.tapclass1 = val
			},

			//关闭费率弹窗
			flshowclose() {
				this.flshow = false
			},
			//打开费率弹窗
			flshowopen() {
				this.flshow = true
			},
			//关闭微信二维码弹窗
			wxshowclose() {
				this.wxshow = false
			},
			//打开微信二维码弹窗
			wxshowopen() {
				if (this.erimg) {
					this.wxshow = true
				} else {
					this.$toast.fail('该小区暂未配置微信客服')
					return
				}
			},
			//关闭验证码弹窗
			twoshowclose() {
				this.twocodeshow = false
			},
			//关闭弹窗
			showbtn() {

				this.show = false
				this.back()
			},
			//跳转附近充电区
			nearbtn() {
				uni.navigateTo({
					url: '../nearest_charging/nearest_charging'
				})
			},
			//打开验证码弹窗
			twoshowopen() {
				this.show = false
				this.twocodeshow = true
				var data = this.yzdata
				this.$base.request('charge/code', 'GET', data)
					.then(res1 => {
						if (res1.data.code == 200) {
							this.yzcode = res1.data.msg
						} else {
							this.$toast.fail(res1.data.msg)
						}
					})
					.catch(err => {

					})
			},
			//获取验证码倒计时
			handleClick() {
				this.Verification = false; //点击button改变v-if的状态
				let auth_timer = setInterval(() => { //定时器设置每秒递减
					this.timer--; //递减时间
					if (this.timer <= 0) {
						this.Verification = true; //60s时间结束还原v-if状态并清除定时器
						clearInterval(auth_timer)
					}
				}, 1000)
			},
			//关闭端口选择弹窗
			duanshowclose() {
				if (this.showclass == 2) {
					let data = {
						ornum: this.ornum
					}
					uni.showLoading({
						title: '请稍候',
						mask: true
					})
					this.$base.request('refund/refund', 'POST', data)
						.then(res1 => {
							if (res1.data.code == 200) {
								uni.hideLoading()
								this.$toast.success('退款成功')
								this.back()
							} else {
								this.$toast.fail(res1.data.msg)
								this.back()
							}
						})
						.catch(err => {

						})
				}

				this.duanshow = false

			},
			//打开端口选择弹窗
			duanshowopen() {
				this.duanshow = true
			},

			//打开故障报修弹窗
			faultshowclose() {
				this.activeNames = ['']
				this.radio = '1'
				this.message = ''
				this.classtap = 'tclass'
				this.imgList = []
				this.reason = '请选择故障类型'
				this.faultshow = false
			},
			//打开故障报修弹窗
			faultshowopen() {
				this.sbnum = this.shebeino + this.portnum

				this.faultshow = true
			},
			//上传图片
			imgInfo(i) {
				let tempList = [];
				this.imgList.forEach(img => {
					tempList.push(img.path);
				});
				//显示图片
				uni.previewImage({
					current: i,
					loop: false,
					urls: tempList,
					indicator: 'default'
				});
			},
			//删除图片
			delImg(i) {
				this.imgList.splice(i, 1);
				this.hat.splice(i, 1);
				this.imgCount++;

			},
			openCamera() {
				uni.chooseImage({
					// sourceType: ['camera'],
					count: this.imgCount,
					sizeType: ['compressed'],
					success: res => {

						let path = res.tempFilePaths[0];
						let userToken = uni.getStorageSync('userToken');

						uni.uploadFile({
							url: Config.api + 'uploadFile',
							filePath: path,
							name: 'file',
							header: {
								Authorization: "Bearer " + userToken
							},
							success: res1 => {
								this.hat.push(JSON.parse(res1.data).data.fileName)
							}

						});
						this.imgList = [...this.imgList, ...res.tempFiles];
						this.imgCount = 3 - this.imgList.length;
					}
				});
			},
			//确认提交报错
			kbtngo() {
				if (this.reason == '请选择故障类型') {
					this.$toast.fail('请选择故障类型')
					return
				}
				let str = "";
				for (var i = 0; i < this.hat.length; i++) {
					str += this.hat[i] + ",";
				}
				//去掉最后一个逗号(如果不需要去掉，就不用写)
				if (str.length > 0) {
					str = str.substr(0, str.length - 1);
				}
				let data = {
					device: this.sbnum,
					type: this.radio1,
					remarks: this.message,
					imgNames: str
				}
				var header = {
					'content-type': 'application/json'
				}
				this.$base.request('failure', 'POST', data, header)
					.then(res => {
						if (res.data.code == 200) {
							this.$toast.success('提交成功')
							this.faultshow = false
							this.tishishow = true
						} else {
							this.$toast.fail(res.data.msg)
						}
					})
					.catch(err => {})

			},

			kbtngoclose() {
				this.tishishow = false
			},
			//返回
			back() {
				if (this.from == '1') { //外部的
					uni.reLaunch({
						url: "../index/index"
					});
				} else if (this.from == '2' || this.from == '3') { //内部跳转过来的
					uni.navigateBack({
						delta: 1
					})
				} else {}

			},
			//轮播广告
			lbbtn() {
				let data = {
					pageNum: 1,
					pageSize: 5
				}

				this.$base.request('notice/list', 'GET', data)
					.then(res => {
						if (res.data.code == 0) {
							var arr = []
							var list = res.data.rows
							for (var i = 0; i < list.length; i++) {
								arr.push(list[i].title)
							}
							this.noticeMsg = arr.join("|")
						}

					})
					.catch(err => {

					})
			},
			colosezhi() {
				this.dshow = false
				var usertype = 'type_' + uni.getStorageSync('userId')
				uni.setStorageSync(usertype, 1)

				this.$base.request('guide/state', 'PUT')
					.then(res => {


					})
					.catch(err => {

					})
			},
			gozhi() {

				this.$base.request('guide/state', 'PUT')
					.then(res => {


					})
					.catch(err => {

					})

				uni.navigateTo({
					url: '../Operation_guide/Operation_guide'
				})
			},
			//获取用户未结算的充电柜订单
			occ() {
				let data = {
					deviceId: this.deviceId
				}
				this.$base.request('charging/occ/list', 'GET', data)
					.then(res => {
						if (res.data.total != 0) {
							this.occtype = 1
							this.cdgnum = "您有" + res.data.total + "条未完成订单,点击查看>>>"
							Dialog.confirm({
								title: '提示',
								message: "您有" + res.data.total + "条未完成订单,点击确认查看",
								confirmButtonText: '查看已有订单',
								cancelButtonText: '开始新的订单'
							}).then(() => {
								uni.navigateTo({
									url: '../unsettled_order/unsettled_order?deviceId=' + this.deviceId
								})
							}).catch(() => {
								this.wtype = 1
								this.oneshow = true
								// on cancel
							});

						} else {
							this.occtype = 0
							this.oneshow = true
						}

					})
					.catch(err => {

					})
			},
			//获取用户未结算的充电柜订单
			occ1() {
				let data = {
					deviceId: this.deviceId
				}
				this.$base.request('charging/occ/list', 'GET', data)
					.then(res => {
						if (res.data.total != 0) {
							this.occtype = 1
							this.cdgnum = "您有" + res.data.total + "条未完成订单,点击查看>>>"

						} else {
							this.occtype = 0
						}

					})
					.catch(err => {

					})
			},
			//跳转充电中列表页面
			occbtn() {
				uni.navigateTo({
					url: '../unsettled_order/unsettled_order?deviceId=' + this.deviceId
				})
			},

			//打开保险弹窗
			bxxy() {
				uni.navigateTo({
					url: '/pages/protocol_specification/protocol_specification'
				})
				// this.cshow = true
			},
			//关闭保险弹窗
			cshowclose() {
				this.cshow = false
			},
			//打开电动车安全使用承诺书
			clshow() {
				console.log('111');
				this.cxyshow = true
			},
			//关闭电动车安全使用承诺书
			clshowclose() {
				this.cxyshow = false
			},
			//跳转账户充值
			czbtn() {
				uni.navigateTo({
					url: '../account_recharge/account_recharge?powerontype=' + 1
				});
			},

			gzbtn() {
				this.gzshow = true
			},
			changbtn() {
				Dialog.alert({
					title: '提示',
					message: '长充模式：当用户充满自停后将一直保持供电，此时段内的功率将按照充电器最大功率的比例换算成相应时长，不会多收用户的费用，旨在解决某些用户充不满的问题。',
				}).then(() => {
					// on close
				});
			},
			//判断当前是小程序环境还是公众号环境
			huanjin() {
				wx.miniProgram.getEnv((res) => {
					if (res.miniprogram) {
						this.xcxtype = 0
					} else {
						this.xcxtype = 1
					}
				})
			},
			//关闭服务费套餐弹窗
			fwfeiclose() {
				this.fwtan = false
			},

			//电动车安全使用承诺书
			xy() {
				let data = {
					appid: uni.getStorageSync('user').appid,
					site: 'chongdian'
				}
				this.$base.agreement(data).then(res => {
						if (res.data.code == 200) {
							this.xieyidata = res.data.data;
							if (this.xieyidata.selecteds == 0) {
								this.xychecked = false; //未勾选
							} else if (this.xieyidata.selecteds == 1) {
								this.xychecked = true; //已勾选
							}
						} else {
							this.xieyidata = {}
						}
					})
					.catch(err => {

					})

			},
			//购买服务费套餐
			buyfuwu(id) {
				if (!this.endTimeStr) {
					Dialog.confirm({
						title: '提示',
						message: "确认购买套餐？",
					}).then(() => {
						let data = {
							areaId: this.areaId,
							projectId: this.projectId,
							serviceDetailId: id
						}
						uni.showLoading({
							title: '请稍候',
							mask: true
						})
						this.$base.request('user/servicePackage', 'POST', data)
							.then(res => {
								uni.hideLoading()
								if (res.data.code == 200) {
									this.$toast.success('购买成功')
									this.fwtan = false
									this.flmap()
								} else if (res.data.code == 20006) {
									this.czbtn()
								} else {
									this.$toast.fail(res.data.msg)
								}

							})
							.catch(err => {

							})
					}).catch(() => {

					});

				} else {
					this.$toast.fail('你已购买过套餐,请勿重复购买')
				}

			},
			flmap() {
				let data = {
					areaId: this.areaId,
					projectId: this.projectId,
				}
				uni.showLoading({
					title: '请稍候',
					mask: true
				})
				this.$base.request('charge/rate', 'GET', data)
					.then(res => {
						uni.hideLoading()
						if (res.data.code == 200) {
							this.projectServiceDetailList = res.data.data.projectServiceDetailList
							this.endTimeStr = res.data.data.endTimeStr
							if (this.endTimeStr) {
								this.xzchecked = '1'
							}
							this.fuwumoney = res.data.data.oftenList[0].num / 100
						}

					})
					.catch(err => {

					})
			},
			//普通充电
			bxcolose() {
				this.isSafe = 0
				this.cdbtnson()
				this.warnshow = false
			},
			//守护充电
			bxque() {
				this.checked = true
				this.tapcdb()
				this.warnshow = false
			},
			seluser() {
				this.$base.request('charge/safe/random', 'GET')
					.then(res => {
						if (res.data.code == 200) {
							this.yonghunum = res.data.data
						} else {
							this.$toast.fail(res.data.msg)
						}
					})
					.catch(err => {

					})
			},
			// 获取用户强制结算的充电柜订单
			occfirst() {
				let data = {
					deviceId: this.deviceId
				}
				this.$base.request('charging/occ/end/list', 'GET', data)
					.then(res => {
						if (res.data.code == 200) {
							if (res.data.data.length > 0) {
								this.occlist = res.data.data
								this.occshow = true
							} else {
								this.occ()
								this.occ1()
							}
						} else {
							this.$toast.fail(res.data.msg)
							this.occ()
							this.occ1()
						}

					})
					.catch(err => {

					})
			},
			know() {
				let data = {
					deviceId: this.deviceId
				}
				this.$base.request('charging/occ/alert', 'POST', data)
					.then(res => {
						if (res.data.code == 200) {
							this.occshow = false
							this.occ()
							this.occ1()
						} else {
							this.$toast.fail(res.data.msg)
							this.occshow = false
							this.occ()
							this.occ1()
						}
					})
					.catch(err => {

					})
			},
			knowclose() {
				this.occshow = false
				this.occ()
				this.occ1()
			},

			gogd(url, jump, msg, libId, teamId) {
				if (jump == 'PU' || jump == 'SA') {
					if (url != 0) {
						let point = 'charge'
						this.ggadd(libId, teamId, point)
						//window.location.href = url
						uni.navigateTo({
							url: '../ad_details/ad_details?url=' + url
						});
						this.ontime = 0
					}
				} else if (jump == 'PA') {
					let point = 'charge'
					this.ggadd(libId, teamId, point)
					uni.navigateTo({
						url: '../ad_details/ad_details?msg=' + msg
					});
					this.ontime = 0
				}
			},
			ggadd(libId, teamId, point) {
				let data = {
					systemId: 0,
					libId: libId,
					teamId: teamId,
					point: point,
					appid: uni.getStorageSync('user').appid,
					projectId: uni.getStorageSync('user').projectId
				}
				this.$base.request('posterClickMsg/add', 'POST', data)
					.then(res => {

					})
					.catch(err => {

					})
			},

			guanggao() {
				var projectId = this.projectId;
				console.log(projectId);
				let data = {
					point: 'charge',
					projectId: projectId,
					token: uni.getStorageSync('userToken')
				}
				this.$base.request('poster/getPosterList', 'POST', data)
					.then(res => {
						if (res.data.code == 200) {
							this.posterList = res.data.data
							if (this.posterList.length > 0) {
								this.poster = 1
							} else {
								this.poster = 0
							}
						} else {
							this.poster = 0
						}
					})
					.catch(err => {

					})
			},

			guanggao1() {
				let data = {
					point: 'chargeSuccess',
					projectId: this.infolist.projectId,
					token: uni.getStorageSync('userToken')
				}
				this.$base.request('poster/getPosterList', 'POST', data)
					.then(res => {
						if (res.data.code == 200) {
							if (res.data.data.length > 0) {
								this.burl = res.data.data[0].url
							} else {
								this.burl = 0
							}
						} else {
							this.burl = 0
						}
					})
					.catch(err => {

					})
			},

			//广告位调用
			getPosterList() {
				let _this = this;
				let data = {
					point: 'charge'
				}
				_this.$base.request('poster/getPosterList', 'GET', data)
					.then(res => {
						if (res.data.code == 200) {
							var list = res.data.data
							console.log(list);
							_this.poster_list = list;

						} else {
							//_this.$toast.fail(res.data.msg)
						}
					})
					.catch(err => {

					})
			},

			tiaozhuan(url) {
				window.location.href = url;
			},

			//充满自停勾选状态
			clickLscmchecked(event) {
				console.log(event.mp.detail);
				this.lscmchecked = event.mp.detail;
			},
			//充满自停勾选状态
			clickOnecmchecked(event) {
				console.log(event.mp.detail);
				this.onecmchecked = event.mp.detail;
			},
			//长充勾选状态
			clickLongcheck(event) {
				console.log(event.mp.detail);
				this.longcheck = event.mp.detail;
			},
			//充电守护勾选状态
			bxbtn(event) {
				if (this.infolist.displayButton == 0) {
					if (this.checked && this.infolist.transfer == 1) {
						this.bxname = '充电守护'
					} else {
						this.bxname = '立即充电'
					}
				}
				this.checked = event.mp.detail;
			},
			//我已阅读勾选状态
			clickXychecked(event) {
				console.log(event.mp.detail);
				this.xychecked = event.mp.detail;
			},
			//上报故障选项折叠面板
			clickActiveNames(event) {
				console.log(event.mp.detail);
				this.activeNames = event.mp.detail;
			},
			//选择故障类型
			gobtn(event) {
				this.reason = this.radio1 = event.mp.detail;
				this.activeNames = ['']
				this.classtap = 'tclass1'
			},
			//修改故障描述
			changeMessage(event) {
				this.message = event.mp.detail;
			},
			//客服电话
			kefutel(phone) {
				uni.makePhoneCall({
					phoneNumber: phone + ''
				});
			},
			//获取会员所处公众号的信息
			get_wechat_view() {
				let that = this;
				that.$base.request('wechat/phone', 'GET')
					.then(res => {
						if (res.data.code == 200) {
							var view = res.data.data;
							if (view.logo) {
								view.logo = Config.imgapi + view.logo;
							}
							if (view.qrcode) {
								view.qrcode = Config.imgapi + view.qrcode;
							}
							that.wechat_view = view;
							uni.setStorageSync('wechat_view', view);
						} else {
							//that.$toast.fail(res.data.msg)
						}
					})
					.catch(err => {

					})
			},
			// 授权手机号
			decryptPhoneNumber(e){
				let that = this;
				console.log(e)
				if(e.detail.errMsg == 'getPhoneNumber:ok'){
					var code = e.detail.code;
					var encryptedData = e.detail.encryptedData;
					var iv = e.detail.iv;
					let data = {
						code: code,
						encryptedData: encryptedData,
						iv: iv
					}
					that.$base.request('user/decryptPhoneNumber', 'POST', data)
						.then(res => {
							if (res.data.code == 200) {
								var view = res.data.data;
								if (view.phone) {
									that.user_phone = view.phone;
									var user = uni.getStorageSync('user');
									user.phone = view.phone;
									uni.setStorageSync('user', user);
									that.cdbtn();
								}
							} else {
								that.$toast.fail(res.data.msg)
							}
						})
						.catch(err => {
					
						})
				}
				else{
					that.$toast.fail('请同意授权手机操作')
					return false;
				}
			},
						
		},
		
		onUnload: function() {
			console.log('App onUnload')
			let that = this;
			that.webIsTrue = false
			uni.closeSocket({
				code: 1000,
				reason: 'App onUnload'
			})
		}
	}
</script>

<style lang="scss">
	.main {
		width: 100%;
		height: 100vh;
		overflow-x: hidden;
		background-color: #2A3034;

		.foothand {
			position: absolute;
			z-index: 9;
			top: 80upx;
			left: 5%;
			width: 90%;
			background: linear-gradient(180deg, #8BC21C 0%, #A8D628 100%);
			border-radius: 24upx;
			padding: 10upx 24upx;
			box-sizing: border-box;
			color: #fff;
		}

		.gztan {
			width: 650upx;
			background-color: #FFFFFF;
			text-align: center;
			padding: 70upx 0;

			.gztanimg {
				width: 350upx;
				height: 350upx;
				margin: 0 auto;

				img {
					width: 350upx;
					height: 350upx;
				}
			}

			.gztantxt {
				margin-top: 30upx;
				font-size: 20upx;
			}
		}

		.hand {
			width: 100%;
			background-color: #2A3034;

			.tap {
				width: 678upx;
				margin: 0 auto;
				height: 265upx;

				image {
					width: 678upx;
					height: 265upx;
					border-radius: 20upx;
				}

				.hlogo {
					width: 207upx;
					height: 160upx;

					image {
						width: 207upx;
						height: 160upx;
					}

					position: relative;
					top: -210upx;
					left: 36upx;
				}

				.hlogo1 {
					width: 177upx;
					height: 177upx;

					image {
						width: 177upx;
						height: 177upx;
					}

					position: absolute;
					top: 70upx;
					left: 36upx;
				}
			}

			.htitle {
				width: 100%;
				box-sizing: border-box;
				padding: 17upx 41upx;
				font-size: 24upx;
				font-family: PingFang SC Regular, PingFang SC Regular-Regular;
				font-weight: 400;
				color: #999999;
			}

			.lun {
				width: 100%;
				box-sizing: border-box;
				background-color: #2A3034;
				padding-bottom: 21upx;

				/deep/.an-notice-box {
					margin: 0upx !important;
					height: 74upx;
					align-items: center;

					.showimage {
						width: 40upx !important;
						height: 32upx !important;
						align-self: center;
						// margin-top: 15upx;
						// margin-left: 16upx;
						margin: 0upx;
					}

					image {
						width: 40upx !important;
						height: 32upx !important;
					}

					.an-notice-content-item {
						line-height: 74upx;
						margin-left: 15upx;
					}
				}
			}

			.black {
				width: 22upx;
				height: 39upx;
				margin: 31upx 0;
				margin-left: 27upx;

				image {

					width: 22upx;
					height: 39upx;
				}

			}
		}

		.showhand {
			width: 100%;
			display: flex;
			justify-content: space-between;
			box-sizing: border-box;
			padding: 0 45upx;
			margin-bottom: 10upx;

			.sone {

				border-radius: 10upx;
				background-image: linear-gradient(#8DC321, #3A4044);
				// background-size: cover;
				font-size: 32upx;
				font-family: PingFang SC Bold, PingFang SC Bold-Bold;
				font-weight: 700;
				text-align: center;
				color: #ffffff;
				padding: 20upx;
			}

			.sone1 {
				padding: 20upx;
				border-radius: 10upx;
				font-size: 32upx;
				font-family: PingFang SC Bold, PingFang SC Bold-Bold;
				font-weight: 700;
				text-align: center;
				color: #fff;
				background-color: #4A4E52;
			}
		}

		.map {
			width: 686upx;
			margin: 0 auto;
			background-color: #2A3034;
			box-sizing: border-box;
			padding: 0 9upx;

			.mhand {
				display: flex;
				width: 100%;
				font-size: 24upx;
				font-family: PingFang SC Bold, PingFang SC Bold-Bold;
				font-weight: 700;
				color: #D0D0D0;
				line-height: 76upx;
				box-sizing: border-box;
				padding: 0 15upx;
				background-color: #3A4044;
				border-radius: 16upx 16upx 0 0;
			}

			.mtap {
				width: 100%;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				box-sizing: border-box;
				padding: 0 12upx;
				background-color: #3A4044;
				border-radius: 0 0 16upx 16upx;
				padding-bottom: 30upx;

				.mchu {
					padding: 34upx 0;
					width: 320upx;
					border-radius: 8upx;
					font-size: 28upx;
					font-family: PingFang SC Bold, PingFang SC Bold-Bold;
					font-weight: 700;
					text-align: left;
					color: #ffffff;
					text-align: center;
					background-color: #8DC321;
					margin-top: 25upx;
					position: relative;

					.mfx {
						font-size: 18upx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #FFFFFF;
						text-align: center;
						padding: 2upx 10upx;
						background-color: #FF6262;
						position: absolute;
						top: 0upx;
						border-radius: 8upx 0 0 0;
					}

					.shuc {
						width: 100%;
						box-sizing: border-box;
						display: flex;
						padding: 0 10upx;

						input {
							width: 50%;
							border-bottom: 1upx solid #FFFFFF;

							// margin-top: 10upx;
							/deep/.uni-input-placeholder {
								color: #FFFFFF;
							}
						}
					}
				}

				.mchu1 {
					padding: 34upx 0;
					width: 320upx;
					border-radius: 8upx;
					font-size: 28upx;
					font-family: PingFang SC Bold, PingFang SC Bold-Bold;
					font-weight: 700;
					text-align: left;
					color: #fff;
					background-color: #4A4E52;
					text-align: center;
					margin-top: 25upx;
					position: relative;

					.mfx {
						font-size: 18upx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #FFFFFF;
						text-align: center;
						padding: 2upx 10upx;
						background-color: #FF6262;
						position: absolute;
						top: 0upx;
						border-radius: 8upx 0 0 0;
					}
				}


			}

			.mhand1 {
				width: 100%;
				box-sizing: border-box;
				margin-top: 36upx;
				padding: 16upx 14upx;
				background-color: #3A4044;
				border-radius: 16upx;
				font-size: 30upx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: rgb(240, 131, 0);
				display: flex;
				align-items: center;

				/deep/.van-checkbox__icon .van-icon {
					border-radius: 6upx;
					border-color: #FFA02E;
				}

				/deep/.van-checkbox__icon--checked .van-icon {
					background-color: #FFA02E;
					border-color: #FFA02E;
					border-radius: 6upx;
				}

				/deep/.van-checkbox__label {
					color: #FFA02E;
				}
			}

			.mhand2 {
				width: 100%;
				box-sizing: border-box;
				margin-top: 36upx;
				padding: 30upx 36upx;
				background: linear-gradient(180deg, #536739 0%, #3A4044 100%);
				border: 3upx solid #8DC321;
				border-radius: 16upx;
				font-size: 30upx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: rgb(240, 131, 0);
				display: flex;
				align-items: center;
				position: relative;

				/deep/.van-checkbox__icon .van-icon {
					border-radius: 6upx;
					border-color: #FFA02E;
				}

				/deep/.van-checkbox__icon--checked .van-icon {
					background-color: #FFA02E;
					border-color: #FFA02E;
					border-radius: 6upx;
				}

				/deep/.van-checkbox__label {
					color: #FFA02E;
				}

				.mhand2img {
					position: absolute;

					image {
						width: 166upx;
						height: 53upx;
					}

					top: -8upx;
					left: 0upx;
				}

			}

			.mshow {
				width: 100%;
				box-sizing: border-box;
				margin-top: 36upx;
				padding-top: 25upx;
				padding-bottom: 10upx;
				background-color: #3A4044;
				border-radius: 16upx;

				.mslist {
					width: 100%;
					box-sizing: border-box;
					display: flex;
					align-items: center;
					padding: 23upx 18upx;
					margin-bottom: 28upx;

					.msleft {
						font-size: 24upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: left;
						color: #D0D0D0;
						width: 25%;
					}

					.msright {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: left;
						color: #fff;
						width: 64%;
						text-align: center;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}

				}

				.tishi {
					width: 100%;
					box-sizing: border-box;
					padding: 0 18upx;
					font-size: 24upx;
					font-family: PingFang SC Medium, PingFang SC Medium-Medium;
					font-weight: 500;
					color: #666666;

					view {
						margin-bottom: 15upx;
					}
				}

				.xza {
					padding: 0 20upx;

					.xza1 {
						font-size: 30upx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 600;
						color: #D0D0D0;
						text-align: left;
						margin: 20upx 0;
					}

					.xzb1 {
						background: #8DC321;
					}

					.xzb2 {
						background: #4A4E52;
					}

					/deep/.van-radio__label {
						color: #fff;
					}

					/deep/.van-radio-group {
						display: flex;
						justify-content: space-between;
					}

					/deep/.van-radio {
						box-sizing: border-box;
						padding: 36upx 50upx;
						border-radius: 24upx;
						font-size: 30upx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;

					}

					/deep/.van-radio__icon--checked .van-icon {
						background-color: #FFA02E;
						border-color: #FFA02E;
					}
				}
			}
		}

		.dbtap {
			font-size: 28upx;
			font-family: PingFang SC Regular, PingFang SC Regular-Regular;
			font-weight: 400;
			color: #999999;
			box-sizing: border-box;
			padding: 0 47upx;
			margin-top: 15upx;
			padding-bottom: 140upx;
		}

		.buyby {
			width: 160upx;
			background-color: #007AFF;
			font-size: 28upx;
			font-family: PingFang SC Medium, PingFang SC Medium-Medium;
			font-weight: 700;
			color: #fff;
			text-align: center;
			padding: 15upx 0;
			border-radius: 12upx;
			margin: 0 47upx;
			margin-top: 10upx;
			margin-bottom: 140upx;
		}

		.double {
			position: fixed;
			display: flex;
			bottom: 40upx;
			left: 5%;
			width: 90%;
			justify-content: space-between;
			box-sizing: border-box;

			.leftbtn {
				width: 30%;
				height: 98upx;
				font-size: 32upx;
				font-family: PingFang SC Bold, PingFang SC Bold-Bold;
				font-weight: 700;
				color: #FFFFFF;
				text-align: center;
				line-height: 98upx;
				background: #F08300;
				border-radius: 50px;
			}



			.rightbtn {
				width: 66%;
				height: 98upx;
				font-size: 34upx;
				font-family: PingFang SC Bold, PingFang SC Bold-Bold;
				font-weight: 700;
				color: #fdfdfd;
				text-align: center;
				line-height: 98upx;
				background: linear-gradient(180deg, #FFA73E 0%, #FF752B 100%);
				border-radius: 36upx;
				display: flex;
				align-items: center;
				justify-content: center;

				image {
					width: 25upx;
					height: 30upx;
					margin-right: 8upx;
				}

				/deep/.van-button__text {
					display: flex;
					align-items: center;
				}
			}

			.zhongbtn {
				width: 66%;
				height: 98upx;
				font-size: 34upx;
				font-family: PingFang SC Bold, PingFang SC Bold-Bold;
				font-weight: 700;
				color: #fdfdfd;
				display: flex;

				.zhongbtnone {
					width: 50%;
					height: 98upx;
					line-height: 98upx;
					text-align: center;
					background: #F08300;
					border-radius: 36upx 0upx 0upx 36upx;
				}

				.zhongbtntwo {
					width: 50%;
					height: 98upx;
					line-height: 98upx;
					text-align: center;
					background: #8DC321;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 0upx 36upx 36upx 0upx;

					image {
						width: 25upx;
						height: 30upx;
						margin-right: 8upx;
					}
				}

				.zhongbtnthree {
					width: 100%;
					height: 98upx;
					line-height: 98upx;
					text-align: center;
					background: #8DC321;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 36upx;

					image {
						width: 25upx;
						height: 30upx;
						margin-right: 8upx;
					}
				}
			}

		}

		.tan {
			/deep/.van-popup {
				border-radius: 16upx;
			}

			.tannei {
				width: 686upx;
				background-color: #FFFFFF;

				.tnhand {
					font-size: 32upx;
					font-family: PingFang SC Bold, PingFang SC Bold-Bold;
					font-weight: 700;
					text-align: center;
					line-height: 72upx;
					color: #333333;
				}

				.tnfoot {
					.tftxt {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						line-height: 50upx;
						color: #333333;
					}

					.tfshow {
						width: 100%;
						box-sizing: border-box;
						display: flex;
						margin-top: 35upx;

						.tfbtn {
							width: 33.33%;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							line-height: 80upx;
							color: #ffffff;
						}

						.tfbtn1 {
							width: 50%;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							line-height: 80upx;
							color: #ffffff;
						}

						.tfbtn2 {
							width: 100%;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							line-height: 80upx;
							color: #ffffff;
						}

						.color1 {
							background-color: #B5B5B5;
						}

						.color2 {
							background-color: #4BED79;
						}

						.color3 {
							background-color: #8DC321;
						}
					}
				}
			}

			.tannei1 {
				width: 642upx;
				background-color: #FFFFFF;

				.tnhand {
					width: 100%;
					height: 80upx;
					background-color: #8DC321;
					align-items: center;

					.tntxt {
						font-size: 32upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						color: #ffffff;
						line-height: 80upx;
						text-align: center;
						position: relative;
					}

					image {
						width: 34upx;
						height: 34upx;
						position: absolute;
						top: 24upx;
						right: 18upx;
					}
				}

				.tnfoot {
					width: 100%;
					margin-top: 24upx;
					margin-bottom: 27upx;

					.tfshang {
						font-size: 34upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 700;
						color: #111111;
						margin-bottom: 15upx;
						text-align: center;
					}

					.tfshang1 {
						font-size: 24upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						color: #F078CE;
						margin-top: 30upx;
					}

					.tfxia {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 700;
						color: #3A4044;
						line-height: 65upx;
						text-align: center;
					}

					.tfxia1 {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						color: #F078CE;
						line-height: 65upx;
					}

					.wxcodeimg {
						width: 260upx;
						height: 260upx;
						margin: 47upx auto;

						image {
							width: 260upx;
							height: 260upx;
						}
					}

					.wxtxt {
						width: 100%;
						box-sizing: border-box;
						padding: 0 45upx;
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: left;
						color: #F08300;
						line-height: 50upx;
					}

				}
			}

			.czone {
				width: 686upx;
				position: relative;
				padding: 0 30upx;
				box-sizing: border-box;
				height: 950upx;

				.cznei {
					width: 100%;
					box-sizing: border-box;
					padding-bottom: 40upx;

					.czneihand {
						font-size: 32upx;
						font-family: PingFang SC Bold, PingFang SC Bold-Bold;
						font-weight: 700;
						text-align: center;
						color: #333333;
						margin: 20upx 0;

					}

					.czneione {
						margin-top: 20upx;

						.cztxtone {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #333333;
							line-height: 45upx;
						}

						.cztxttwo {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 700;
							color: #333333;
							margin: 10upx 0;
						}
					}
				}

				.czdel {
					position: absolute;
					top: 5upx;
					right: 35upx;

					image {
						width: 40upx;
						height: 40upx;
					}
				}
			}

			.tannei2 {
				width: 686upx;
				background-color: #FFFFFF;

				.fwfei {
					width: 600upx;
					border-radius: 16upx;
					margin: 0 auto;
					box-shadow: 0upx 4upx 9upx 0upx rgba(44, 44, 44, 0.21);
					display: flex;
					box-sizing: border-box;
					justify-content: space-between;
					align-items: center;
					padding: 27upx 24upx;
					margin-bottom: 30upx;
					display: flex;
					justify-content: space-between;
					align-items: center;

					.fwfeileft {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						color: #333333;
					}

					.fwfeiright {
						padding: 10upx 20upx;
						border-radius: 10upx;
						background-color: #8DC321;
						color: #FFFFFF;
						font-size: 22upx;
					}
				}

				.tquxiao {
					width: 240upx;
					height: 64upx;
					border-radius: 16upx;
					line-height: 64upx;
					margin: 92upx auto;
					font-size: 34upx;
					font-family: PingFang SC Medium, PingFang SC Medium-Medium;
					font-weight: 500;
					text-align: center;
					color: #AFB0B0;
				}

				.tnhand {
					width: 100%;
					height: 80upx;
					background-color: #8DC321;
					align-items: center;

					.tntxt {
						font-size: 34upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						color: #ffffff;
						line-height: 80upx;
						text-align: center;
						position: relative;
					}

					image {
						width: 25upx;
						height: 25upx;
						position: absolute;
						top: 19upx;
						right: 18upx;
					}

				}

				.tfshow {
					width: 100%;
					box-sizing: border-box;
					display: flex;
					margin-top: 35upx;

					.tfbtn {
						width: 33.33%;
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						line-height: 80upx;
						color: #ffffff;
					}

					.tfbtn1 {
						width: 50%;
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						line-height: 80upx;
						color: #ffffff;
					}

					.tfbtn2 {
						width: 100%;
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						line-height: 80upx;
						color: #ffffff;
					}

					.color1 {
						background-color: #B5B5B5;
					}

					.color2 {
						background-color: #8DC321;
					}

					.color3 {
						background-color: #4B98ED;
					}
				}

				.tnfoot {
					width: 100%;
					margin-top: 24upx;
					margin-bottom: 27upx;

					.yancodetxt {
						font-size: 28upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						color: #333333;
					}

					.yannum {
						width: 442upx;
						height: 88upx;
						background-color: #7BF199;
						border-radius: 10upx;
						font-size: 60upx;
						font-family: Arial Black, Arial Black-Black;
						font-weight: 900;
						text-align: center;
						line-height: 88upx;
						color: #333333;
						margin: 0 auto;
						margin-top: 34upx;
					}

					.yztap {
						.yanbtn {
							width: 255upx;
							height: 77upx;
							border-radius: 10upx;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #ffffff;
							text-align: center;
							line-height: 77upx;
							background-color: #4B98ED;
							margin: 0 auto;
							margin-top: 22upx;
						}
					}

					.yzhand {
						font-size: 32upx;
						font-family: PingFang SC Bold, PingFang SC Bold-Bold;
						font-weight: 700;
						text-align: center;
						color: #333333;
						margin-top: 74upx;
					}

					.yzfoot {
						width: 100%;
						display: flex;
						margin-top: 36upx;
						box-sizing: border-box;
						padding-right: 13upx;

						.tzfootleft {
							width: 399upx;
							height: 435upx;

							image {
								width: 399upx;
								height: 435upx;
							}
						}

						.tzfootright {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							line-height: 50upx;
							color: #333333;
							margin-left: 27upx;
						}
					}

					.tfone {
						font-size: 28upx;
						width: 88%;
						margin: 0 auto;
						background-color: rgba(141, 195, 33, 0.2);
						;
						color: #3A4044;
						padding: 0 24upx;
						box-sizing: border-box;
						padding-bottom: 14upx;
						font-weight: 700;
					}



					.duanlist {
						width: 100%;
						box-sizing: border-box;
						padding: 26upx;
						display: flex;
						flex-wrap: wrap;

						// justify-content: center;
						.duantap {
							margin: 14upx 0;
							width: 135upx;
							height: 88upx;
							border: 1upx solid #8DC321;
							border-radius: 8upx;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							// line-height: 88upx;
							line-height: 88upx;
							color: #3A4044;
							margin-left: 15upx;
						}

						.duantap1 {
							margin: 14upx 0;
							width: 135upx;
							height: 88upx;
							border: 1px solid #999999;
							border-radius: 8upx;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							line-height: 88upx;
							color: #666666;
							margin-left: 15upx;
						}


					}

					.duanlist1 {
						width: 100%;
						box-sizing: border-box;
						padding: 26upx;
						display: flex;
						flex-wrap: wrap;

						// justify-content: center;
						.duantap {
							margin: 14upx 0;
							width: 135upx;
							height: 88upx;
							border: 1upx solid #F08300;
							border-radius: 8upx;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							// line-height: 88upx;
							color: #F08300;
							margin-left: 15upx;
						}

						.duantap1 {
							margin: 14upx 0;
							width: 135upx;
							height: 88upx;
							border: 1px solid #8DC321;
							border-radius: 8upx;
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							text-align: center;
							line-height: 42upx;
							color: #3A4044;
							margin-left: 15upx;
						}

						/** 0=空闲 */
						.port0 {
							color: #8DC321;
							border: 1upx solid #8DC321;
						}

						/** 1=充电中 */
						.port1 {
							color: #CDCDCD;
							border: 1upx solid #CDCDCD;
						}

						/** 2=未充占用 */
						.port2 {
							color: #BC12ED;
							border: 1upx solid #BC12ED;
						}

						/** 3=充满占用 */
						.port3 {
							color: #0103FD;
							border: 1upx solid #0103FD;
						}

						/** 4=端口故障 */
						.port4 {
							color: #E40C00;
							border: 1upx solid #E40C00;
						}

						/** 5=浮充 */
						.port5 {
							color: #06F9E0;
							border: 1upx solid #06F9E0;
						}

						/** 6=存储器损坏 */
						.port6 {
							color: #005BAC;
							border: 1upx solid #005BAC;
						}

						/** 7=安全门卡住 */
						.port7 {
							color: #d3ac2b;
							border: 1upx solid #d3ac2b;
						}

						/** 8=保险丝烧断 */
						.port8 {
							color: #009DA2;
							border: 1upx solid #009DA2;
						}

						/** 9=继电器粘连 */
						.port9 {
							color: #ee45e4;
							border: 1upx solid #ee45e4;
						}

						/** 10=门磁芯片损坏 */
						.port10 {
							color: #FDF204;
							border: 1upx solid #FDF204;
						}

						/** 88=绑定端口 */
						.port88 {
							color: #ffac93;
							border: 1upx solid #ffac93;
						}

						/** 99=禁用端口 */
						.port99 {
							color: #400000;
							border: 1upx solid #400000;
						}

					}

					.duanbtn {
						width: 570upx;
						height: 88upx;
						border-radius: 16upx;
						background-color: #8DC321;
						font-size: 32upx;
						font-family: PingFang SC Medium, PingFang SC Medium-Medium;
						font-weight: 500;
						text-align: center;
						color: #ffffff;
						line-height: 88upx;
						margin: 55upx auto;
					}
				}

				.kshow {
					width: 100%;
					box-sizing: border-box;
					padding: 33upx 36upx;
					background-color: #FFFFFF;
					margin-top: 51upx;

					.kone {
						width: 100%;
						margin-bottom: 20upx;

						input {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #999999;
							border-bottom: 1upx solid #e8e8e8;
							padding: 11upx 0;
						}

					}

					.ktwo {
						width: 100%;
						box-sizing: border-box;

						/deep/.tclass {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #999999;
						}

						/deep/.tclass1 {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 700;
							color: #333333;
						}

						/deep/.van-cell {
							padding: 18upx 0upx;
						}

						/deep/.van-radio__label {
							font-size: 28upx;
							font-family: PingFang SC Bold, PingFang SC Bold-Bold;
							font-weight: 700;
							color: #333333;
							margin-left: 90upx;
						}

						/deep/.van-radio__icon {
							height: 20upx !important;

							/deep/.van-icon {
								width: 20upx;
								height: 20upx;
								border: 1upx solid #cccccc;
							}

							width: 20upx;
							height: 20upx;
							margin-left: 80upx;
						}

						/deep/.van-radio {
							// margin-bottom: 15upx;
							height: 70upx;
						}

						/deep/.van-collapse-item__wrapper {
							box-shadow: 0px 16upx 8upx -10upx #cacaca;
							margin-bottom: 10upx;

						}
					}

					.kthree {
						.kthreehand {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #333333;
							margin-top: 33upx;

							.khtxttwo {
								font-size: 24upx;
								color: #666666;
							}
						}

						.kthreefoot {
							width: 100%;
							box-sizing: border-box;
							margin-top: 21upx;

							/deep/.van-cell {
								background-color: #F0F0F0;
								height: 236upx;
								border-radius: 16upx;
							}
						}
					}

					.kfour {
						width: 100%;
						box-sizing: border-box;
						margin-top: 35upx;

						.kfourtxt {
							font-size: 28upx;
							font-family: PingFang SC Medium, PingFang SC Medium-Medium;
							font-weight: 500;
							color: #333333;

							.kfourbud {
								font-size: 24upx;
								color: #666666;
							}
						}

						.add-img-box {
							display: flex;
							width: 750rpx;
							//padding: 0 40rpx;
							flex-direction: row;
							flex-wrap: wrap;
						}

						.add-img-item {
							width: 128upx;
							height: 128upx;
							border-radius: 16upx;
							position: relative;
							padding: 9rpx 0;
							margin-right: 20upx;
						}

						.add-img-camera {
							flex: 1;
						}

						.add-img {
							width: 128upx;
							height: 128upx;
							border-radius: 16upx;
						}

						.add-img-del {
							position: absolute;
							width: 40rpx;
							height: 40rpx;
							right: -14upx;
							top: -6upx;
							border-radius: 20rpx;
						}

						.address-time {
							width: 484rpx;
							height: 88rpx;
							background-color: rgba(245, 245, 245, 1);
							opacity: 1;
							border-radius: 24rpx;
							text-align: center;

							font-size: 35rpx;
							font-weight: 500;
							color: rgba(51, 51, 51, 1);
						}

						.line {
							width: 750rpx;
							height: 1px;
							transform: scaleY(0.3);
							background-color: rgba(0, 0, 0, 0.5);
						}
					}

					.kbtn {
						width: 570upx;
						height: 88upx;
						background: #8DC321;
						border-radius: 16upx;
						font-size: 32upx;
						font-family: PingFang SC Bold, PingFang SC Bold-Bold;
						font-weight: 700;
						text-align: center;
						line-height: 88upx;
						margin: 0 auto;
						margin-top: 59upx;
						color: #ffffff;
					}
				}
			}

			.tishione {
				width: 686upx;
				height: 211upx;
				opacity: 0.7;
				border-radius: 10upx;
				font-size: 28upx;
				font-family: PingFang SC Medium, PingFang SC Medium-Medium;
				font-weight: 500;
				color: #ffffff;
				background-color: #B5B5B5;
				box-sizing: border-box;
				padding: 43upx 61upx 42upx 38upx;
			}
		}

		.tanshi {
			width: 600upx;
			padding: 100upx 0;

			.xz {
				text-align: center;
				padding: 0 30upx;

				image {
					width: 300upx;
					height: 289upx;
				}

				.xzone {
					margin-top: 28upx;
					font-weight: bold;
					color: #000000;
					margin-bottom: 80upx;
					font-size: 38upx;

				}

				.xztwo {
					margin-top: 15upx;
					font-weight: 600;
					color: #4587e8;
					font-size: 30upx;
				}

				.xzthree {
					margin-top: 30upx;
					font-weight: 600;
					color: #4e4e4e;
					font-size: 20upx;
					margin-bottom: 40upx;
				}
			}

			.anniu {
				display: flex;
				justify-content: space-between;
				padding: 0 90upx;
				font-weight: 600;
				font-size: 28upx;
				color: #333333;

				.anniu1 {
					width: 130upx;
					height: 55upx;
					line-height: 55upx;
					border-radius: 40upx;
					text-align: center;
					border: #333333 2upx solid;
				}
			}
		}

		.xytanshi {
			width: 600upx;
			padding-top: 40upx;
			padding-bottom: 100upx;

			.shdun {
				width: 155upx;
				height: 177upx;
				margin: 0 auto;

				image {
					width: 155upx;
					height: 177upx;
				}
			}

			.plustore {
				.plustoreone {
					background: linear-gradient(180deg, #E0FFC0 0%, #FAFFEF 100%);
					;
					border-radius: 24upx;
					text-align: center;
					font-size: 34upx;
					width: 484upx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 700;
					color: #111111;
					line-height: 48upx;
					margin: 0 auto;
					box-sizing: border-box;
					padding: 25upx 55upx;

					span {
						color: #EC651C;
					}
				}

				.plustoretwo {
					font-size: 30upx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 700;
					color: #3A4044;
					line-height: 42upx;
					text-align: center;
					margin-top: 18upx;
					margin-bottom: 51upx;
				}

			}

			.pantap {
				display: flex;
				width: 100%;
				justify-content: space-between;
				align-items: center;
				padding: 0 30upx;
				box-sizing: border-box;

				.pantapone {
					width: 230upx;
					height: 80upx;
					border-radius: 24upx;
					border: 2upx solid #6D726E;
					font-size: 34upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #4A4E52;
					line-height: 80upx;
					text-align: center;
				}

				.pantaptwo {
					width: 230upx;
					height: 80upx;
					background: #8DC321;
					border-radius: 24upx;
					font-size: 34upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
					line-height: 80upx;
					text-align: center;
				}
			}

		}

		.occtan {
			/deep/.van-popup {
				border-radius: 16upx;
				overflow-x: hidden;
			}

			.occmap {
				width: 686upx;
				background-color: #F8F8F8;
				padding: 36upx;
				box-sizing: border-box;

				.occfoot {
					background: #fff;
					border-radius: 24upx;
					box-sizing: border-box;
					padding: 14upx 24upx;
					margin-bottom: 20upx;

					.occfootone {
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						font-size: 28upx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #3A4044;
						line-height: 33upx;
						align-items: center;
						margin-bottom: 16upx;

						span {
							font-weight: 700;
						}
					}
				}

				.occdibu {
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: space-between;

					.occdibuone {
						padding: 21upx 50upx;
						background: #636B82;
						border-radius: 16upx;
						color: #fff;
						text-align: center;
					}

					.occdibutwo {
						padding: 21upx 50upx;
						background: linear-gradient(180deg, #FFA73E 0%, #FF752B 100%);
						border-radius: 16upx;
						color: #fff;
						text-align: center;
					}
				}
			}
		}
	}

	.kant {
		width: 100%;
		box-sizing: border-box;

		.ddtap {
			width: 100%;
			height: 375upx;
			margin: 0 auto 20rpx;

			image {
				width: 100%;
				height: 375upx;
			}

			video {
				width: 100%;
				height: 375upx;
			}
		}
	}

	.van-button {
		background: transparent !important;
		border: 0 !important;
		line-height: 49px !important;
		height: 98rpx !important;
		display: block !important;
	}

	.van-button::after {
		display: none;
	}

	.van-button::before {
		display: none;
	}

	.btnkf {

		background: transparent;

		margin: 0;

	}

	.btnkf::after {
		display: none;
	}
	.paytt{
		height: 100rpx;
		line-height: 100rpx;
		text-align: center;
	}
	.pay_btn{
		color: #ffffff;
		background-color: #32ae57;
		border: 1px solid #32ae57;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		width: 200rpx;
		margin: 50rpx auto 0;
		font-size: 32rpx;
		border-radius: 20rpx;
	}
	.ico{
		width: 50rpx;
		margin-right: 20rpx;
		vertical-align: middle;
	}
	.pay_typed{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 0 30rpx;
		border-bottom: 1px #efefef solid;
		padding: 30rpx 0;
	}
	.close{
		width: 30rpx;
		height: 30rpx;
		position: absolute;
		right: 50rpx;
		top: 35rpx;
	}
	
	.box{
		width: 150rpx;
		height: 150rpx;
		background: red !important;
		color: #fff;
		transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		position: absolute;
		right: -75rpx;
		top: -75rpx;
	}
	 
	.box text {
		position: absolute;
		bottom: 15rpx;
		left: 48rpx;
		font-size: 26rpx;
		font-weight: 600;
		font-family: '微软雅黑,Microsoft YaHei';
	}
</style>